How i18n works for Docusaurus src/components?答案

【问题标题】：How i18n works for Docusaurus src/components?How i18n works for Docusaurus src/components?
【发布时间】：2022-12-01 22:25:57
【问题描述】：

I have i18n perfectly setup and working for themes and plugins of a Docusaurus website.

But for the homepage, I have a component Foo.js located in src/components/Foo.js.

It contains a const Bar = 'happy';

Is a text string that will be part of the HTML returned by the component and I want it translated.

I guess it should be possible; in the documentation is stated:

JSON is used to translate: Your React code: standalone React pages in src/pages, or other components

and

code.json # Any text label present in the React code

The Bar text is not extracted with docusaurus write-translations.

Should I add manually to code.json ? If yes, which is the correct key to use?

Thank you in advance for your help.

【问题讨论】：

标签： internationalization docusaurus

【解决方案1】：

You need to import the Translate component and use it to wrap translatable strings in your custom code.

Details and examples can be found in the Translate your React code section in the Docusaurus i18n documentation.

For your example you'd end up with something like:

import Translate from '@docusaurus/Translate';
const Bar = <Translate id="mcall.foo.bar">happy</Translate>

【讨论】：

Thank you very much for pointing me in the right direction, perfect, got it, appreciated. I just couldn't find before the relevant piece of info in the documentation.