如何在 angular-cli 构建中包含自定义文件？

对于 Angular 8 读者，

.htaccess必须是 src/.htaccess 。见下文，

 "assets": [
    "src/favicon.ico",
     "src/assets",
     "src/.htaccess"
  ],

确保您已将 .htaccess 文件放在项目的 src 目录中。

并且放入的文件是 angular.json，而不是 angular-cli.json

（如果您需要一个有效的 htaccess 文件，那么您可以在这里找到一个 - https://stackoverflow.com/a/57126352/767625）

而已。现在应该在您点击 ng build --prod=true 时复制它。

希望这可以帮助某人。

干杯，

---

一种解决方案（尽管在我看来有点破解）是在您的 main.ts 文件中声明一个变量，该变量需要您想要包含在 webpack 构建输出中的额外文件。

前任：

import './polyfills.ts';

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { enableProdMode } from '@angular/core';
import { environment } from './environments/environment';
import { AppModule } from './app/';

/* HACK: Include standalone web.config file manually in webpack build
 *
 * Due to the way the beta angular-cli abstracts the webpack config files into
 * angular-cli.json and lacks current documentation we were unable to find
 * a way to include additional files manually in the webpack build output.
 *
 * For hosting on IIS we need to include a web.config file for
 * specifying rewrite rules to make IIS compatible with the Angular Router.
 * The one liner following this comment is a hack to accomplish this
 * and should be reviewed and corrected as soon as adequete documentation
 * is available for the angular-cli configuration file.
 */
const webConfig = require('file?name=[name].[ext]!./web.config');

if (environment.production) {
    enableProdMode();
}

platformBrowserDynamic().bootstrapModule(AppModule);

当 webpack 在 main.ts 中遇到这个变量声明语句时，它将发出原始 web.config 文件作为构建输出的一部分：

                            Asset       Size  Chunks             Chunk Names
                       inline.map    5.59 kB       2  [emitted]  inline
                       web.config  684 bytes          [emitted]
                 styles.bundle.js    16.7 kB    1, 2  [emitted]  styles
                        inline.js    5.53 kB       2  [emitted]  inline
                         main.map    5.36 MB    0, 2  [emitted]  main
                       styles.map    22.6 kB    1, 2  [emitted]  styles
                   main.bundle.js    4.85 MB    0, 2  [emitted]  main
                       index.html    1.98 kB          [emitted]
                assets/.npmignore    0 bytes          [emitted]
         assets/styles/global.css    2.74 kB          [emitted]
Child html-webpack-plugin for "index.html":
         Asset     Size  Chunks       Chunk Names
    index.html  4.45 kB       0
webpack: bundle is now VALID.

一个理想的解决方案是在 webpack 配置中，但到目前为止，我无法确定 angular-cli 如何通过 angular-cli.json 管理它（beta.16）。

因此，如果有人有更好的答案来扩展 angular-cli 生成项目的 webpack 配置，我很乐意听到。

---

angular-cli.json 文件中有一个“脚本”部分。您可以在那里添加所有第三方 javascript 文件。

---

修改 angular.json。向资产数组添加条目：

{
  "glob": "**/web.config",
  "input": "src/",
  "output": "./"
}

---

就我而言，我使用了 Angular 版本 5，因此我在运行 ng build --prod 命令时尝试创建名为 Staticfile.txt 的文件。确保给出文件扩展名，否则它不会创建文件。

---