mirror of
https://github.com/facebook/docusaurus.git
synced 2025-04-28 17:57:48 +02:00
121 lines
3.2 KiB
Text
121 lines
3.2 KiB
Text
---
|
|
sidebar_position: 3
|
|
---
|
|
|
|
# I18n lifecycles
|
|
|
|
Plugins use these lifecycles to load i18n-related data.
|
|
|
|
## `getTranslationFiles({content})` {#getTranslationFiles}
|
|
|
|
Plugins declare the JSON translation files they want to use.
|
|
|
|
Returns translation files `{path: string, content: ChromeI18nJSON}`:
|
|
|
|
- `path`: relative to the plugin localized folder `i18n/[locale]/[pluginName]`. Extension `.json` should be omitted to remain generic.
|
|
- `content`: using the Chrome i18n JSON format.
|
|
|
|
These files will be written by the [`write-translations` CLI](../../cli.mdx#docusaurus-write-translations-sitedir) to the plugin i18n subfolder, and will be read in the appropriate locale before calling [`translateContent()`](#translateContent) and [`translateThemeConfig()`](#translateThemeConfig)
|
|
|
|
Example:
|
|
|
|
```js
|
|
module.exports = function (context, options) {
|
|
return {
|
|
name: 'my-plugin',
|
|
// highlight-start
|
|
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,
|
|
},
|
|
},
|
|
];
|
|
},
|
|
// highlight-end
|
|
};
|
|
};
|
|
```
|
|
|
|
## `translateContent({content,translationFiles})` {#translateContent}
|
|
|
|
Translate the plugin content, using the localized translation files.
|
|
|
|
Returns the localized plugin content.
|
|
|
|
The `contentLoaded()` lifecycle will be called with the localized plugin content returned by `translateContent()`.
|
|
|
|
Example:
|
|
|
|
```js
|
|
module.exports = function (context, options) {
|
|
return {
|
|
name: 'my-plugin',
|
|
// highlight-start
|
|
translateContent({content, translationFiles}) {
|
|
const myTranslationFile = translationFiles.find(
|
|
(f) => f.path === 'myTranslationFile',
|
|
);
|
|
return {
|
|
...content,
|
|
someContentLabel: myTranslationFile.someContentLabel.message,
|
|
};
|
|
},
|
|
// highlight-end
|
|
};
|
|
};
|
|
```
|
|
|
|
## `translateThemeConfig({themeConfig,translationFiles})` {#translateThemeConfig}
|
|
|
|
Translate the site `themeConfig` labels, using the localized translation files.
|
|
|
|
Returns the localized `themeConfig`.
|
|
|
|
Example:
|
|
|
|
```js
|
|
module.exports = function (context, options) {
|
|
return {
|
|
name: 'my-theme',
|
|
// highlight-start
|
|
translateThemeConfig({themeConfig, translationFiles}) {
|
|
const myTranslationFile = translationFiles.find(
|
|
(f) => f.path === 'myTranslationFile',
|
|
);
|
|
return {
|
|
...themeConfig,
|
|
someThemeConfigLabel: myTranslationFile.someThemeConfigLabel.message,
|
|
};
|
|
},
|
|
// highlight-end
|
|
};
|
|
};
|
|
```
|
|
|
|
## `async getDefaultCodeTranslationMessages()` {#getDefaultCodeTranslationMessages}
|
|
|
|
Themes using the `<Translate>` API can provide default code translation messages.
|
|
|
|
It should return messages in `Record<string, string>`, where keys are translation IDs and values are messages (without the description) localized using the site's current locale.
|
|
|
|
Example:
|
|
|
|
```js
|
|
module.exports = function (context, options) {
|
|
return {
|
|
name: 'my-theme',
|
|
// highlight-start
|
|
async getDefaultCodeTranslationMessages() {
|
|
return readJsonFile(`${context.i18n.currentLocale}.json`);
|
|
},
|
|
// highlight-end
|
|
};
|
|
};
|
|
```
|