angular-cli 是否会删除未使用的模块,即使它是在 app.module 中导入的并且不使用它?

Will angular-cli removes unused modules even if it is imported in app.module and not use it?

我在 angular cli 的死代码 elimination/tree shaking 中几乎不需要澄清。

Github

我打算使用 ngZorro ui 库。根据文档,我需要在我的 app.module 文件中导入 NgZorroAntdModule。它包含它提供的所有组件。现在,如果我只使用其中的一些,angular cli 是否仍会在我的最终产品 build.

中捆绑所有组件

我尝试单独导入我需要的模块uire,它有效,但我仍然想知道 angular cli 的树 shaking/dead 代码消除是否删除未使用的模块甚至尽管它是在 app.module.

中导入的

下面是我检查过的类似内容。
我在 app.module.ts 中包含以下 Material 个模块 但我只使用 mat-raised-button 它是我代码中 MatButtonModule 的一部分。
这是我使用 source-map-explorer 分析时在 main 包中得到的

Though i included Menu, Toolbar, Icon and FormField Modules in my app.module.ts, since i am not using them in the code they aren't included in webpack bundle.

这是我使用的构建配置 -

ng build --prod --build-optimizer --vendor-chunk --progress --output-hashing=all --stats-json --source-map=true

您可以在生成包后对其进行分析,以使用以下工具查看包中包含的模块:
webpack-bundle-analyzer, source-map-explorer.

  • 您需要生成stats.json文件,然后您可以使用webpack-bundle-analyzer[=48进行分析=]
  • 对于 source-map-explorer 您需要使用 --source-map=true
  • 生成产品版本

构建包的优化还取决于您用于产品构建的标志。
有关您可以使用的标志的详细信息,请参阅 Angular Build Documentation

Tree-shaking 只能与以构建优化器可以删除未使用代码的方式构建的库一起使用。

在 v5.5 之前不支持 tree-shaking 的 RxJS 就是这种情况

NG-Zorro 只有一个导入模块(适用于所有组件),但它现在支持 tree-shaking,因为 1.x