自Angular CLI 6起，ng build --prod不会缩小/丑化/删除注释 [英] ng build --prod does NOT minify / uglify / remove comments since Angular CLI 6

问题描述

由于我已经升级了Angular应用程序以使用Angular CLI版本6.x，因此将其编译以进行生产(照常使用ng build --prod)不会生成精简的js.这会导致很大的vendor.js大小(在我的情况下几乎为10 MB).

Since I've upgraded my Angular app to use Angular CLI version 6.x, compiling it for production (using ng build --prod, as usual) does not produce minified js. This result in very big vendor.js size (in my case is almost 10 MB).

如果我打开生成的vendor.js文件，我可以清楚地看到代码没有缩小并且注释也没有删除.

If I open the resulting vendor.js file, I can clearly see that the code is not minified and the comments are not removed.

推荐答案

问题出在angular.json文件中.

在键projects.MY_PROJECT_NAME.architect.build.configurations.production下，当您创建新的角度项目时，我缺少了通常在production配置中默认出现的所有选项.

Under the key projects.MY_PROJECT_NAME.architect.build.configurations.production, I was missing all the options that normally comes by default in the production configuration when you create a new angular project.

这是production配置的外观，以解决此问题:

This is how the production configuration should look like in order to fix the issue:

"production": {
  "fileReplacements": [
    {
      "replace": "src/environments/environment.ts",
      "with": "src/environments/environment.prod.ts"
    }
  ],
  "optimization": true,
  "outputHashing": "all",
  "sourceMap": false,
  "extractCss": true,
  "namedChunks": false,
  "aot": true,
  "extractLicenses": true,
  "vendorChunk": false,
  "buildOptimizer": true
},

由于某些原因，从以前的Angular CLI版本升级后，我的production配置仅具有fileReplacements键.添加上面显示的其他属性(optimization，outputHashing等)对我来说解决了这个问题.

For some reasons, after upgrading from previous Angular CLI versions, my production configuration only had the fileReplacements key. Adding the other properties shown above (optimization, outputHashing, etc...) solved the issue for me.

这篇关于自Angular CLI 6起，ng build --prod不会缩小/丑化/删除注释的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！