Angular 14本地库Service在应用与库中使用时非单例问题

问题分析 #

你的核心问题是ApplicationService在库和应用中被多次实例化，通常由以下原因导致：

• 多个注入器层级重复声明服务
• 本地库的symlink构建配置问题
• Angular缓存引发的依赖解析异常

解决方案 #

1. 移除重复的服务声明 #

你的ApplicationService已通过@Injectable({ providedIn: 'root' })标记为根注入器提供，禁止在任何模块的providers数组中手动添加该服务。

修改app.module.ts的providers数组，删除手动声明的ApplicationService：

// app.module.ts 修正后的providers配置
providers: [
  { provide: LOCALE_ID, useValue: 'fr-FR' },
  { provide: INJECT_ENV, useValue: environment },
  // 移除此行：ApplicationService,
  {
    provide: APP_INITIALIZER,
    useFactory: appInitializerFn,
    multi: true,
    deps: [ApplicationService]
  }
],

同时检查库内的SharedModule和InputModule，确保它们的providers数组中也没有声明ApplicationService。

2. 修复本地库构建配置 #

打开项目根目录的angular.json，找到你的library项目的build配置，添加preserveSymlinks: true：

"projects": {
  "your-library-name": {
    "architect": {
      "build": {
        "options": {
          "preserveSymlinks": true,
          // 保留其他原有配置
        }
      }
    }
  }
}

该配置确保Angular将本地库视为应用的一部分，而非独立第三方包，避免服务被多次实例化。

3. 加固单例模式（可选） #

为库的SharedModule添加forRoot()方法，明确仅在根模块导入时初始化服务（虽providedIn: 'root'已足够，但可避免误操作）：

// shared.module.ts
import { ModuleWithProviders, NgModule } from '@angular/core';

@NgModule({
  declarations: [],
  imports: [],
  exports: []
})
export class SharedModule {
  static forRoot(): ModuleWithProviders<SharedModule> {
    return {
      ngModule: SharedModule,
      providers: [
        // 不要在此添加ApplicationService，它已由providedIn: 'root'管理
        // 可添加库内其他需要单例的服务
      ]
    };
  }
}

之后在AppModule中导入SharedModule.forRoot()，库内其他模块（如InputModule）仅导入普通的SharedModule。

4. 清理缓存并重新构建 #

运行以下命令清理缓存并重新构建库与应用：

ng clean
ng build your-library-name
ng serve

验证 #

在ApplicationService的构造函数中添加日志：

constructor(@Inject(INJECT_ENV) private environment: IEnvironment, private themeSelectorService: ThemeSelectorService) {
  console.log('ApplicationService 实例化');
}

启动应用后，若控制台仅输出一次该日志，说明服务已成为单例。

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