Angular 5通过Yarn运行生产环境时控制台报Assertion失败错误

嘿，我之前帮不少Angular 5开发者排查过这个生产构建的报错，这个问题基本都和模板语法不规范或者构建/依赖的兼容性问题有关——毕竟Angular 5的生产模式（AOT编译+优化）对代码的校验比开发模式严格得多。给你几个具体的排查和解决步骤：

• 先检查模板里的*ngFor语法
  这个报错里的"for"关键字，十有八九和*ngFor的写法有关。比如有没有漏写let关键字？错误示例：*ngFor="item of items"，正确写法必须是*ngFor="let item of items"。另外也要检查自定义指令里有没有模仿ngFor但写错了指令名或者内部逻辑的情况。

• 排查第三方依赖的兼容性
  Angular 5属于比较旧的版本，很多新的第三方库没有做向下兼容。你可以试试临时移除最近新增的依赖包，然后重新运行yarn build --prod，如果错误消失，就说明是这个依赖的问题。之后可以找该库适配Angular 5的版本，或者替换成其他兼容的替代库。

• 调整生产构建的优化配置
  Angular 5生产构建默认开启的AOT编译和代码压缩，有时候会因为配置过于激进导致代码被误处理。你可以先在构建配置里暂时关闭部分优化来测试：
  打开angular.json（如果是旧版CLI就是.angular-cli.json），找到configurations.production节点，修改成：

  "production": {
    "aot": false,
    "optimization": false
  }
  

  然后重新构建，如果错误消失，再逐步开启这些优化项，定位到底是哪个环节出了问题，再针对性调整细节配置。

• 校验TypeScript配置和版本
  Angular 5只兼容TypeScript 2.4.x到2.6.x的版本，别用太高的TS版本。同时检查tsconfig.json里的target字段，建议设置为es5，避免语法编译后出现兼容性问题。

• 清理缓存后重新构建
  有时候Yarn或者Angular的缓存会残留旧的编译文件，导致奇怪的报错。执行以下命令彻底清理后重新安装构建：

  yarn cache clean
  rm -rf node_modules
  rm -rf dist
  yarn install
  yarn build --prod
  

内容的提问来源于stack exchange，提问作者Mak