时间戳

首页 > 解决方案 > 离子 3，ngx 翻译 9.x；build -> ngc: 内部错误：未知标识符 TranslateLoader & TranslatePipe

angular - 离子 3，ngx 翻译 9.x；build -> ngc: 内部错误：未知标识符 TranslateLoader & TranslatePipe

问题描述

我在 ionic 3.9.2 下使用延迟加载的 ngx-translate (v9)遇到了一些困难。在我运行“buid --prod”之前，浏览器中的一切正常。构建过程的 npc 部分（我认为它是 AOT 编译）报告 TranslateLoader 和 TranslatePipe 的“未知标识符”。

虽然我已经按照 ionic 的ngx 教程，阅读了 ngx-translate 和 StackOverflow 的 github，但我没有找到对类似问题的讨论。因此，我想求助。

当我运行ionic cordova build ios --prod时出现以下错误（请注意第一行，显示 TranslateLoader 和 TranslatePipe 的问题）：

Error: Internal error: unknown identifier [{"filePath":"..../node_modules/@ngx-translate/core/core.d.ts","name":"TranslateLoader","members":[]},{"filePath":"..../node_modules/@ngx-translate/core/core.d.ts","name":"TranslatePipe","members":[]}]
    at Object.importExpr$$1 [as importExpr] (..../node_modules/@angular/compiler/bundles/compiler.umd.js:31063:23)
    at tokenExpr (..../node_modules/@angular/compiler/bundles/compiler.umd.js:20063:39)
    at providerDef (..../node_modules/@angular/compiler/bundles/compiler.umd.js:19966:20)
    at ..../node_modules/@angular/compiler/bundles/compiler.umd.js:20188:77
    at Array.map (<anonymous>)
    at NgModuleCompiler.compile (..../node_modules/@angular/compiler/bundles/compiler.umd.js:20188:44)
    at AotCompiler._compileModule (..../node_modules/@angular/compiler/bundles/compiler.umd.js:30956:32)
    at ..../node_modules/@angular/compiler/bundles/compiler.umd.js:30838:66
    at Array.forEach (<anonymous>)
    at AotCompiler._compileImplFile (..../node_modules/@angular/compiler/bundles/compiler.umd.js:30838:19)
[11:14:07]  copy finished in 9.27 s

这是我的 app.module.ts

...

import { HttpClient, HttpClientModule } from "@angular/common/http";
import { TranslateLoader, TranslateModule } from "@ngx-translate/core";
import { TranslateHttpLoader } from "@ngx-translate/http-loader";

...

@NgModule({
  declarations: [
    MyApp,
  ],
  imports: [
    TranslateModule.forRoot({
      loader: {
        provide: [TranslateLoader],
        useFactory: (HttpLoaderFactory),
        deps: [HttpClient]
      }
    }),
    IonicModule.forRoot(MyApp,{
      preloadModules: true, 
    }),
    BrowserModule,
    HttpClientModule,
    BrowserAnimationsModule,
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,

  ],
  providers: [SplashScreen, Keyboard, StatusBar, {provide: ErrorHandler, useClass: IonicErrorHandler}, AuthService]
})

...

包.json：

"@ngx-translate/core": "^9.1.1",
"@ngx-translate/http-loader": "^2.0.1", // 3rd version gives the same error.

然后，我在应用程序中将 ngx-translate 导入为具有相同导出函数 HttpLoaderFactory() 的 .forChild({...})。

最奇怪的是，当我从

    TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,
        useFactory: (HttpLoaderFactory),
        deps: [HttpClient]
      }
    }),

to（提供 TranslateLoader 作为数组）

    TranslateModule.forRoot({
      loader: {
        provide: [TranslateLoader],
        useFactory: (HttpLoaderFactory),
        deps: [HttpClient]
      }
    }),

错误消息变得更短，TranslatePipe 的问题消失了：

Error: Internal error: unknown identifier [{"filePath":".../node_modules/@ngx-translate/core/core.d.ts","name":"TranslateLoader","members":[]}]
    at Object.importExpr$$1 [as importExpr] (.../node_modules/@angular/compiler/bundles/compiler.umd.js:31063:23)
    at tokenExpr (.../node_modules/@angular/compiler/bundles/compiler.umd.js:20063:39)
    at providerDef (.../node_modules/@angular/compiler/bundles/compiler.umd.js:19966:20)
    at .../node_modules/@angular/compiler/bundles/compiler.umd.js:20188:77
    at Array.map (<anonymous>)
    at NgModuleCompiler.compile (.../node_modules/@angular/compiler/bundles/compiler.umd.js:20188:44)
    at AotCompiler._compileModule (.../node_modules/@angular/compiler/bundles/compiler.umd.js:30956:32)
    at .../node_modules/@angular/compiler/bundles/compiler.umd.js:30838:66
    at Array.forEach (<anonymous>)
    at AotCompiler._compileImplFile (.../node_modules/@angular/compiler/bundles/compiler.umd.js:30838:19)

能否请你帮忙？

此致

雅库布

标签： angularcordovaionic3angular2-aotngx-translate

解决方案

好的，我想通了。我在我的所有页面和组件中都使用它来启动 TranslateModule：

TranslateModule.forChild({
      loader: {
        provide: [TranslateLoader],
        useFactory: (HttpLoaderFactory),
        deps: [HttpClient]
      }
    }),

我把它改成这样：

TranslateModule.forChild()

它正在工作。

也许这会对某人有所帮助。

推荐阅读