Spartacus 应用程序中未启用翻译

Question

我正在为 SAP Commerce 店面使用 Spartacus 库，但无法启用 i18n 功能。官方文档指出，要开始，您只需添加以下配置 (https://sap.github.io/spartacus-docs/i18n/):

providers: [
  provideConfig({
    i18n: {
      resources: translations,
      chunks: translationChunksConfig,
    },
  }),
];

虽然没有说明应该在哪里添加它，但我假设它应该转到 app.module.ts 文件到 @NgModule 装饰器中。这就是 app.module.ts 文件在我的例子中的样子：

import { HttpClientModule } from "@angular/common/http";
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { EffectsModule } from "@ngrx/effects";
import { StoreModule } from "@ngrx/store";
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { CustomPdpModule } from "./custom-pdp/custom-pdp.module";
import { SpartacusModule } from './spartacus/spartacus.module';
import { provideConfig } from "@spartacus/core";
import { translationChunksConfig, translations } from "@spartacus/assets";

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    AppRoutingModule,
    StoreModule.forRoot({}),
    EffectsModule.forRoot([]),
    SpartacusModule,
    CustomPdpModule,
  ],
  providers: [
    provideConfig({
      i18n: {
        resources: translations,
        chunks: translationChunksConfig,
        fallbackLang: 'en',
      },
    }),
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

我正在尝试在自定义模块 CustomPdpModule 中使用 cxTranslate 管道，如下所示： {{ 'common.search' | cx翻译}} 在店面而不是翻译的字符串上，我看到 [common:common.search] 并在控制台中看到以下警告：

有人可以指出我到目前为止做错了什么或者我错过了什么重要的东西吗？

谢谢。

Answer 1

如果您想使用 cxTranslate 管道，请确保从 @spartacus/core 导入 I18nModule 并将其添加到 AppModule 的导入部分：

以下是有关解决 i18n 问题的提示。

在我的 app.module.ts 中，我使用 B2cStorefrontModule.withConfig 来传递我的应用程序特定配置。在 Chrome 开发工具中，我在第 82 行设置了断点：

然后在运行时触发断点时，您可以检查调试器，检查给定的翻译键是否存在，例如您的情况下的“common.search”。如果不存在，您将遇到此线程中提到的错误消息。

我正在基于 Spartacus 2.1 版本进行测试，但我没有发现公共块下有翻译键“搜索”，如上图突出显示的区域所示。

我刚刚通过以下方式手动添加了自定义翻译密钥：

function provideAdditionaLanguage(translations: TranslationResources) {
  translations["en"].common.common.jerrysearch = "Jerry Search";
  return translations;
}

并在下面的 AppModule 中进行配置：

然后在我的页面消费它：

最终结果，有效：

此致，杰瑞

Spartacus 应用程序中未启用翻译

Translations are not enabled in Spartacus application

internationalization

spartacus-storefront