带有 CLI 的 Angular 2 - 为生产而构建

Question

我刚刚安装了 angular-cli 1.0.0.beta.17(最新版本)，开始新项目，能够毫无问题地在端口 4200 上服务项目 - 只是标准的“应用程序工作!”消息。

但是，当我尝试使用命令 ng build --prod 为生产构建这个空的通用应用程序时，我根本没有创建 main.*.js 文件并且有几个屏幕像这样的警告:

• 删除未使用的函数...
• 初始化中的站点效果...
• 等

这是一个全新的空项目——我还没有机会破坏任何东西......

如何构建生产版本？

Answer 1

为 Angular v6+ 更新

# Prod - these are equivalent
ng build --configuration=production
ng build --c=production
ng build --prod=true

# Dev - and so are these
ng build --configuration=development
ng build --c=development
ng build --prod=false
ng build

更多标志设置在这里

https://angular.io/cli/build

---

根据 Angular-cli 的 github wiki v2+，这些是启动开发和生产构建的最常用方法

# Prod these are equivalent
ng build --target=production --environment=prod
ng build --prod --env=prod
ng build --prod

# Dev and so are these
ng build --target=development --environment=dev
ng build --dev --env=dev
ng build --dev
ng build

有不同的默认标志会影响 --dev 和 --prod 构建。

Flag                 --dev      --prod
--aot                false      true
--environment        dev        prod
--output-hashing     media      all
--sourcemaps         true       false
--extract-css        false      true

--prod 还设置了以下不可标记的设置:

• 如果在 .angular-cli.json 中配置，则添加 service worker。
• 将模块中的 process.env.NODE_ENV 替换为 production 值(这对于某些库来说是必需的，例如 react)。
• 在代码上运行 UglifyJS。

---

我需要进行一些故障排除才能使 AOT 正常工作。我跑的时候:

ng build --prod --aot=false

我会得到一个类似于

的错误

Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory'

最初，我必须进行一些项目重构才能让 AOT 正常工作。但是，如果您遇到此错误，它们可能是一个修复程序。试试

npm i enhanced-resolve@3.3.0

https://github.com/angular/angular-cli/issues/7113