如何为新的Angular 4项目启用树抖动

我刚刚用CLI创建了一个新的Angular 4项目：

ng new test

版本：

@angular/cli: 1.0.0
node: 6.10.0
os: win32 x64
@angular/common: 4.0.1
@angular/compiler: 4.0.1
@angular/core: 4.0.1
@angular/forms: 4.0.1
@angular/http: 4.0.1
@angular/platform-browser: 4.0.1
@angular/platform-browser-dynamic: 4.0.1
@angular/router: 4.0.1
@angular/cli: 1.0.0
@angular/compiler-cli: 4.0.1

但是，树抖动无法正常工作，因为我未使用的类

FooBar

仍在

main.*.js

文件中

我的示例组件TS文件（输出中不应包含FooBar）：

我尝试使用汇总（如文档中所述），但效果不太好

有没有一种简单的方法可以让树摇晃？（我希望在通过CLI创建项目时默认启用它）

更新：我使用的是

ng build--prod

，它仍然没有动摇。

更新：来自：

所有构建都使用绑定和有限的树抖动，而

--prod

构建还通过UglifyJS运行有限的死代码消除

见下文

--prod

构建默认为

--aot=true

现在；这已经有一段时间了

我在angular.io网站上找不到任何文档，其中提供了大量有关树木摇动确切过程的详细信息。Angular CLI已经使用webpack一段时间了，这里有一些关于该工具如何进行树抖动的信息。这似乎是一个共同的主题

---

只要您遵循上面关于AOT的链接中的指导原则，您应该会有好的结果。如果您在使用第三方库进行AOT编译时遇到困难，则始终存在编写库不支持AOT的风险。尽管如此，AOT兼容性在当今是可以预期的。

尝试使用

ng build--prod--AOT

来使用

ng build--prod--build optimizer

。这样，vendor.js和main.js就组合在main.js文件中。为了避免您必须添加

--vendor chunk=true

您使用的是什么

ng

命令？我使用的是

ng build--prod

，但它仍然没有被抖动。CLI甚至使用树抖动吗？根据食谱中angular.io文档中有关树摇的内容，它使用rollup进行树摇。但从CLI的源代码看，package.json中没有汇总依赖项。除非他们用别的东西摇树。正如R.Richards在他的更新中所说的，转到Angular.Io页面进行AoT编译和树抖动。angular文档写得很好，所以您不应该有任何问题。这就是我最近在Angular 4中的项目中实现AoT和树抖动时使用的方法。如果使用

ng cli

创建项目，则默认情况下支持它。@R.Richards该链接没有关于抖动的任何信息。你能在你的答案中发布它的要点吗？@adamdport-answer更新了一些额外的链接和信息。我想没什么要点。只需遵循指导原则。我希望这能帮到你。@R.Richards，你如何确保摇树有效？@Jun我不知道有什么可靠的方法可以知道摇树有效。我相当信任这些工具。我有时会比较dev和prod版本之间输出的文件大小。如果prod文件更小，我假设死代码被删除了。我还没有找到一种方法来测试这个过程是否符合人们的期望。

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'app works!';
}

export class FooBar {
  foo = "hello";
}