使用 Transloco 处理 Angular monorepo

Question

我们使用 Angular v15 monorepo，其中包含多个应用程序和库。 monorepo 和应用程序是使用 Angular CLI 文档中的指示创建的。这些库是 Angular 模块，可以通过

tsconfig.json

文件中的路径映射导入到其他库或应用程序中。这就像一个魅力。

对于 i18n 支持，我们选择使用 Transloco 而不是 NGX-Translate，因为后者已不再积极开发。将 Transloco 添加到 monorepo 非常简单，并且开箱即用。目前，当库加载到应用程序中时，就会加载来自库的翻译，这也可以正常工作。

现在我们已经包含了 Transloco Keys Manager，并且

extract

和

find

命令可以像使用

--project

选项的应用程序一样工作。但是，当我使用以下命令提取库的密钥时，我收到

Input path provided doesn't exist!

错误：

./node_modules/.bin/transloco-keys-manager extract -i projects/ui-lib/src/lib/ -o projects/ui-lib/src/assets/i18n/

我们的单一仓库结构是：

<project-dir>
  - transloco.config.js
  + projects
    + app-1
    + app-2
    + ui-lib
      + src
        + assets
          + i18n
            - en.json
        + lib
          + ui-component-1
          + ui-component-2
          - ui-lib.module.ts

Transloco 配置包含

module.exports = {
  langs: ['en'],
  keysManager: {
        input: 'app',
        translationsPath: 'assets/i18n',
        sort: true,
        addMissingKeys: true,
        replace: false,
        emitErrorOnExtraKeys: true,
        defaultValue: 'MISSING:{{key}}'
    }
};

对于如何解决这个问题有什么建议吗？相关版本信息：

• 角度 v15.2.8
• Transloco v4.2.2
• Transloco 密钥管理器 v3.7.0

Answer 1

一种解决方案是在

angular.json

中为库添加一个虚拟项目：

"UILib": {
  "projectType": "library",
  "root": "projects/ui-lib",
  "sourceRoot": "projects/ui-lib/src"
}

此外，请确保 transloco 配置文件中的

keyManager

对象未指定

input

属性，因为这将由项目类型确定。

Answer 2

从Transloco Keys Manager v5开始，密钥管理器支持提取库的密钥。确保从

@jsverse

范围安装它。