Angular11升级12出现inject() must be called from an injection context错误求解

该报错的本质是Site2项目运行时加载了两份@angular/core实例，inject() API 与当前加载的Angular核心实例的注入上下文绑定，跨实例调用就会触发该错误。
Angular 12对多应用工作区的依赖解析逻辑做了调整，你Site2直接跨目录导入主目录的SharedModule时，会触发解析器加载SharedModule路径下对应的node_modules依赖，和Site2自身的node_modules内的@angular/core产生重复。

• 方案1：配置TS路径映射强制依赖统一
  在项目根目录的tsconfig.json的compilerOptions节点下新增paths配置，强制所有Angular相关包都指向根目录的node_modules，同时给SharedModule配置别名避免相对路径跳级导入：

{
  "compilerOptions": {
    "paths": {
      "@angular/*": ["./node_modules/@angular/*"],
      "@shared/*": ["./你的SharedModule实际所在的相对路径/*"]
    }
  }
}

修改Site2中所有导入SharedModule的语句，从相对路径（比如../../shared/xxx）替换为别名导入import { SharedModule } from '@shared/shared.module'。

• 方案2：开启重复模块ID兼容
  如果方案1未生效，在Site2的main.ts入口文件顶部添加如下代码，临时兼容多实例场景：

import { ɵsetAllowDuplicateNgModuleIds } from '@angular/core';
ɵsetAllowDuplicateNgModuleIds(true);

// 原有bootstrap逻辑保持不变
platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.error(err));

• 方案3：调整Angular构建配置
  在angular.json中找到Site2的构建配置节点projects.Site2.architect.build.options，新增/修改如下配置：

{
  "preserveSymlinks": true,
  "commonChunk": true,
  "vendorChunk": false
}

1. 在浏览器开发者工具的「Sources」面板搜索core.js，查看加载的文件列表中是否存在两份不同路径的@angular/core包，确认是否为重复加载问题。
2. 在报错位置core:4745的injectInjectorOnly方法处打断点，查看调用栈中SharedModule的导入路径，确认是否为跳级相对路径导入。
3. 安装Angular DevTools浏览器插件，查看注入树中SharedModule的所属注入器，确认是否和Site2的根注入器不属于同一实例。

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