Angular 16升级后导入TranslationModule报错求助

问题原因 #

Angular 16强化了NgModule的校验逻辑，要求导入的模块必须是带有@NgModule装饰器的合法NgModule类。而angular-l10n v8.1.2的TranslationModule采用旧版定义方式，导出结构不符合Angular 16的校验标准，因此被判定为“未添加@NgModule注解”。

解决方案 #

方案1：包装兼容NgModule（推荐） #

创建自定义包装模块，将旧版TranslationModule重新封装为符合Angular 16要求的NgModule：

// translation-wrapper.module.ts
import { NgModule } from '@angular/core';
import { TranslationModule as OriginalTranslationModule } from 'angular-l10n';

@NgModule({
  imports: [OriginalTranslationModule],
  exports: [OriginalTranslationModule]
})
export class TranslationWrapperModule {}

随后在SharedModule中替换原导入和导出项：

// shared.module.ts
import { TranslationWrapperModule } from './translation-wrapper.module';

@NgModule({
  imports: [
    CommonModule,
    MaterialModule,
    TranslationWrapperModule, // 替换原TranslationModule
    RouterModule,
    HttpClientModule,
    FlexLayoutModule,
    MatFormFieldModule,
    MatInputModule,
    MatSelectModule,
    CustomBreakpointsModule,
    PdfViewerModule
  ],
  declarations: [
    ...components.allComponents,
    ...directives.allDirectives,
    ...pipes.allPipes,
    ...uiElements.allComponents,
    ...allShell,
    EventsHandlerDirective
  ],
  exports: [
    CommonModule,
    MaterialModule,
    TranslationWrapperModule, // 替换原TranslationModule
    FlexLayoutModule,
    ...components.allComponents,
    ...directives.allDirectives,
    ...pipes.allPipes,
    ...uiElements.allComponents,
    ...allShell
  ]
})
export class SharedModule {}

方案2：放宽TypeScript编译校验 #

在tsconfig.json中添加Angular编译配置，降低NgModule校验严格度：

{
  "angularCompilerOptions": {
    "strictNgModuleMetadataEmit": false,
    "skipTemplateCodegen": false
  }
}

注意：此方案仅为临时绕过校验，可能隐藏其他潜在问题，不建议长期使用。

方案3：局部替换TranslationModule定义 #

若不想全量升级angular-l10n，可参考新版本TranslationModule的@NgModule定义，在项目中创建本地模块文件，包裹旧版的服务、管道等核心内容。此方案需熟悉angular-l10n内部结构，风险较高，谨慎使用。

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