Angular 2和Angular Cli的树摇优化生产构建，vendor.js过大。

Question

Angular 2和Angular Cli的树摇优化生产构建，vendor.js过大。

6

我做了一个小的Angular 4应用程序，但我不知道如何应用树摇和AOT编译。我运行的命令如下：

ng build --prod --aot

但是我得到的结果仍然很大，供应商文件为2.63Mb：

Hash: 3f2f9863802ffee21a18
Time: 35397ms
chunk    {0} polyfills.3be44b11f98572593d31.bundle.js (polyfills) 158 kB {4} [initial] [rendered]
chunk    {1} main.62b1e2f835ae0e344351.bundle.js (main) 537 kB {3} [initial] [rendered]
chunk    {2} styles.6ad044d12ab50a9da898.bundle.css (styles) 69 bytes {4} [initial] [rendered]
chunk    {3} vendor.a13d6c29b7348e1ae91d.bundle.js (vendor) 2.63 MB [initial] [rendered]
chunk    {4} inline.01f2c419c67f5155d8a3.bundle.js (inline) 0 bytes [entry] [rendered]

这是最终的应用程序，还是ng cli出了问题？

这是我的CLI版本：

@angular/cli: 1.0.0-rc.4
node: 6.10.0
os: win32 x64
@angular/common: 4.0.0-rc.6
@angular/compiler: 4.0.0-rc.6
@angular/core: 4.0.0-rc.6
@angular/forms: 4.0.0-rc.6
@angular/http: 4.0.0-rc.6
@angular/material: 2.0.0-beta.2
@angular/platform-browser: 4.0.0-rc.6
@angular/platform-browser-dynamic: 4.0.0-rc.6
@angular/router: 4.0.0-rc.6
@angular/cli: 1.0.0-rc.4
@angular/compiler-cli: 4.0.0-rc.6

- albanx

1

也许这是一个 bug？我今天将一个小的 Angular 2 应用程序更新到 Angular 4，然后 vendor.js 文件从 380KB 增加到了 1.3MB，scripts.js 文件从 95.3KB 增加到了 545KB。 - sloth

我认为在最新版中，AOT自动成为了ng的默认选项。但是我可能错了。我自己使用ngc来控制部署的内容，我的整个站点（包括Angular 2的组件、几个第三方库、Bootstrap、我的CSS文件和大约30个组件）压缩后大约只有350KB。 - kha

使用source-map-explorer。 - user663031

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Hemant Kumar Singh · Accepted Answer

运行ng build --prod命令即可实现带有Tree Shake和AOT的Angular 4产品构建，无需使用--aot标志。构建应该像这样（ chunk {5} vendor.46351c4e9fc678f82bca.bundle.js (vendor) 1.13 MB [initial] [rendered] ) 。注意：在此输出中，1.13MB不是您获得的文件大小，请查看/dist目录中的文件大小，您将得到316KB。您可以查看构建输出和实际获得的结果。