跳到主要内容

I18n 生命周期

插件通过这些生命周期加载与国际化相关的数据。

getTranslationFiles({content})

插件声明它们希望使用的 JSON 翻译文件。

返回翻译文件 {path: string, content: ChromeI18nJSON}

  • path:相对于插件本地化文件夹 i18n/[locale]/[pluginName] 的路径。为保持通用性,建议省略 .json 扩展名。
  • content:采用 Chrome i18n JSON 格式。

这些文件会被 write-translations CLI 写入插件的 i18n 子文件夹,并会在调用 translateContent()translateThemeConfig() 前按需读取对应语言的内容。

示例:

my-plugin.js
export default function (context, options) {
return {
name: 'my-plugin',
async getTranslationFiles({content}) {
return [
{
path: 'sidebar-labels',
content: {
someSidebarLabel: {
message: 'Some Sidebar Label',
description: 'A label used in my plugin in the sidebar',
},
someLabelFromContent: content.myLabel,
},
},
];
},
};
}

translateContent({content,translationFiles})

使用本地化翻译文件对插件内容进行翻译。

返回本地化后的插件内容。

contentLoaded() 生命周期会接收到 translateContent() 返回的本地化内容。

示例:

my-plugin.js
export default function (context, options) {
return {
name: 'my-plugin',
translateContent({content, translationFiles}) {
const myTranslationFile = translationFiles.find(
(f) => f.path === 'myTranslationFile',
);
return {
...content,
someContentLabel: myTranslationFile.someContentLabel.message,
};
},
};
}

translateThemeConfig({themeConfig,translationFiles})

使用本地化翻译文件对站点 themeConfig 标签进行翻译。

返回本地化后的 themeConfig

示例:

my-plugin.js
export default function (context, options) {
return {
name: 'my-theme',
translateThemeConfig({themeConfig, translationFiles}) {
const myTranslationFile = translationFiles.find(
(f) => f.path === 'myTranslationFile',
);
return {
...themeConfig,
someThemeConfigLabel: myTranslationFile.someThemeConfigLabel.message,
};
},
};
}

async getDefaultCodeTranslationMessages()

主题在使用 <Translate> API 时,可以提供默认的代码翻译消息。

应返回 Record<string, string> 格式的消息对象,key 为翻译 ID,value 为当前站点语言下的消息文本(不含描述)。

示例:

my-plugin.js
export default function (context, options) {
return {
name: 'my-theme',
async getDefaultCodeTranslationMessages() {
return readJsonFile(`${context.i18n.currentLocale}.json`);
},
};
}