Angular 从 8 升级到 9 - 模板中的 Ivy 编译错误

Question

我根据 Angular 更新指南成功地将我的 Angular 应用程序从版本 8 升级到版本 9，并且我解决了 ts 文件中出现的所有问题。

在版本 8 中，我没有使用 Ivy，而是使用 View Engine，因为它是默认设置。

升级到 9 后，我的 Angular 应用程序只能在禁用 Ivy 的情况下工作（“enableIvy”：tsconfig.json 中的 false）。启用 Ivy 后，模板中出现很多错误，其中一些错误是：

1. 无法绑定到“我的属性”，因为它不是“我的组件”的已知属性
2. 没有找到与 exportAs 'ngForm' 相关的指令
3. 无法绑定到“ngClass”，因为它不是“div”的已知属性
4. 无法绑定到“routerLink”，因为它不是“a”的已知属性
5. templateUrl: "./my-component.component.html", 组件模板出错

我在使用 View Engine 时没有遇到这些错误，并且该应用运行正常。

这似乎是配置或模块导入问题？ 我懒加载模块，如：

loadChildren: () => import('./items/items.module').then(m => m.ItemsModule)

在 package.json 中使用

"postinstall": "ngcc"

在 tsconfig.json 中

{
  "compileOnSave": false,
  "compilerOptions": {
    "downlevelIteration": true,
    "importHelpers": true,
    "module": "esnext",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es6",
    "typeRoots": ["node_modules/@types"],
    "types": ["jest"],
    "lib": ["es2015", "dom"],
    "skipLibCheck": true
  },
  "angularCompilerOptions": {
    "enableIvy": true
  },
}

有什么想法吗？ :)

Answer 1

尝试更改 EcmaScript 目标：“es5”。很好解释下link

我使用 angular 9 我有 tsconfig.json 这种方式。

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "module": "esnext",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2018",
      "dom"
    ]
  }
}