Angular Cli：禁用缩小答案

【问题标题】：AngularCli: disable minificationAngular Cli：禁用缩小
【发布时间】：2017-09-19 07:19:27
【问题描述】：

有没有办法在 AngularCli 中禁用缩小？

在我启动命令 ng build --prod 后，我需要将 dist 文件夹中的所有 files.js 分开且清晰可见。

【问题讨论】：

是否有任何理由反对在没有--prod 标志的情况下使用ng build？
如果你在非生产模式下构建会发生什么？另外，为什么你需要所有单独的 JS？
'ng build --prod --source-map' 还将生成源映射，您的浏览器可以使用这些映射向您显示原始代码（用于调试）。但使用“ng serve”（默认开发模式）将是解决此问题的最佳方式。
对不起，ng build 禁用缩小是真的。但我想要的是每个组件的所有files.js都单独保存，而不是全部保存在main.bundle.js中
有趣的对话。我们有同样的需求：不要因为某些功能而缩小（因为类重命名）某些模块。有什么想法吗？

标签： angular-cli

【解决方案1】：

为了获得简单、分离和未压缩的 js 文件，您只需使用 typescript 编译它们 (tsc) 到您的dist 目录。

无需使用 cli 构建。按照设计，Angular CLI 在构建时会捆绑所有的 javascript 文件。

来自 cli build documentation:

所有构建都使用捆绑和有限的 tree-shaking，而 --prod 构建还通过 UglifyJS 运行有限的死代码消除。

【讨论】：

我不认为这是正确的。打字稿无法编译角度模板
另外 typescript 不创建任何包，它只输出 .ts 文件的 1 对 1 .js 翻译

【解决方案2】：

ng build --build-optimizer=false

使用“aot”选项时启用“@angular-devkit/build-optimizer”优化。

更多详情https://angular.io/cli/build

【讨论】：

虽然此代码可以回答问题，但提供有关如何和 为什么 解决问题的附加上下文将提高答案的长期价值。
运行它并不会阻止我的捆绑和缩小，
这并没有为我禁用 JSUglify 缩小

【解决方案3】：

只要做：

ng build --prod --optimization=false

这似乎做到了。更多信息请见：https://github.com/angular/angular-cli/wiki/build

这对角度 6 有效。*

【讨论】：

角度 5 怎么样？
不知道，抱歉！仅开始使用 Angular 6.*+
C'est genial :-D 我试图找出，在已发布的 Angular 站点中，什么设置负责文件缩小，特别是在 typescript 站点上，但不能！然后我找到了你的帖子... :-D 谢谢！
很高兴为您提供帮助！ :D

【解决方案4】：

注意：如果你通过一些 package.json 运行目标使用 ng serve，根据 Angular6 的手册页，对应的开关是：

ng serve --optimization=false

将显着加快此 bs 的开发速度

【讨论】：

有意义的使用。在 prod 中，它会导致大量输出，但 @devenv 会有所帮助。
这是我的伎俩，看看哪个提供者注入失败！我收到了Error: No provider for t，现在我收到一条更人性化的错误消息No provider for ComponentLoaderFactory!
今天这个选项是deprecated 和ng serve，但它可以和ng build 一起使用并通过配置angular.json 文件

【解决方案5】：

2018 年的回复现已过时。对于 Angular 的更新版本（撰写本文时为 13 个），不推荐使用 --optimization=false 标志。相反，您可以实现如下相同的结果：

在您的angular.json 中，您可以针对特定环境进行配置（例如，在 dev 中没有优化，但在 prod 中进行了优化）。

      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "optimization": false,
            ...
          }
        }
      }

您还可以更精细地控制启用哪些优化：

"optimization": {
  "scripts": true,
  "fonts": false,
  "styles": false
}

这些也可以进一步完善（例如样式：minify、inlineCritical）

【讨论】：