Angular9库通过npm link导入Angular8项目报@NgModule注解错误如何解决

1. Angular主版本不兼容 #

你使用Angular 9编译生成的库，无法直接在Angular 8项目中运行。Angular跨大版本的编译输出、装饰器元数据格式互不兼容：Angular 9默认启用Ivy编译器，而Angular 8默认使用ViewEngine编译器，低版本编译器无法识别高版本Ivy编译生成的@NgModule元数据，因此会抛出「未添加@NgModule注解」的错误。

2. npm link导致的依赖重复加载 #

npm link生成的软链接默认会优先加载库自身node_modules中的Angular依赖，而非业务项目中的Angular 8依赖，运行时会同时存在两个版本的Angular实例，不同实例的装饰器元数据互不互通，即使版本一致也可能触发该报错。

3. 库构建参数错误 #

你使用ng build library1 --watch生成的是开发环境产物，没有做兼容性处理，也会导致元数据无法被低版本项目识别。

• 首先对齐Angular主版本：要么将库降级到Angular 8重新开发构建，要么将业务项目升级到Angular 9，保证两者的Angular主版本完全一致。
• 调整库构建配置：
  1. 在库的tsconfig.lib.json中关闭Ivy编译，添加配置："angularCompilerOptions": { "enableIvy": false }
  2. 使用生产模式构建库：执行ng build library1 --prod，不要使用开发模式的watch构建产物做link
• 修复依赖解析问题：在业务项目的angular.json中找到serve配置项，添加"preserveSymlinks": true，避免软链接导致的依赖解析错误，配置示例：

{
  "projects": {
    "<你的项目名称>": {
      "architect": {
        "serve": {
          "options": {
            "preserveSymlinks": true
          }
        }
      }
    }
  }
}

• 所有配置调整完成后，重新执行库构建、npm link、项目启动的流程即可。

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