Angular12引入自定义库运行ng serve报缺少依赖（Angular8正常）问题咨询

根因分析 #

该问题是Angular 12版本的默认配置变动导致的：

• Angular 12默认启用Ivy编译器，新增了严格的入口点依赖校验逻辑，旧版Angular 8的兼容写法不再适用
• lib1中使用的import {Button} from 'node_modules/lib2/dist/js/app.js'属于非标准的绝对路径导入写法，Angular 12会将该路径识别为lib1包内的相对路径，不会从宿主项目的node_modules根目录解析，因此即使路径实际存在也会报依赖缺失

修复方案 #

方案1：修改lib1的导入规则（优先选择，长期有效） #

调整lib1源码中的导入语句，使用符合ES模块规范的写法，不需要拼接node_modules前缀：

// 原错误写法
import {Button} from 'node_modules/lib2/dist/js/app.js'
// 修改后写法
import {Button} from 'lib2/dist/js/app.js'

修改完成后重新打包lib1，再安装到Angular 12项目即可正常编译。

方案2：无法修改lib1源码时调整宿主项目配置 #

如果没有lib1的修改权限，可以在宿主项目中加配置兼容：

• 打开项目根目录的tsconfig.json，在compilerOptions下新增路径映射，强制解析到正确的lib2路径：

{
  "compilerOptions": {
    "paths": {
      "node_modules/lib2/dist/js/app.js": ["./node_modules/lib2/dist/js/app.js"]
    }
  }
}

• 打开angular.json，在projects > 你的项目名 > architect > build > options下添加配置，避免CommonJS格式的lib2抛出兼容性警告：

"allowedCommonJsDependencies": ["lib2"]

方案3：临时应急跳过校验 #

如果需要快速启动项目验证其他逻辑，可以临时关闭Ivy的依赖校验，修改package.json的启动命令：

"scripts": {
  "start": "NG_BUILD_IGNORE_MISSING_DEPENDENCIES=true ng serve"
}

之后执行npm start即可跳过校验启动项目。

注意：请确保lib2已经在宿主项目package.json的dependencies字段中显式声明，不要作为lib1的隐式依赖存在。

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