React
This guide assumes that you are using react-localization
module. If that is not the case, you can still use mooi and would only need to adjust your output format in a similar fashion.
Step 1 - Create a translations file
Create a mooi
directory
mkdir mooi
Within that directory, create a translations.yaml
file with your strings
# ./mooi/translations.yaml
languages: # English is assumed by default, you don't need to list it
- de
- fr
- ru
# etc.
entries:
- key: myTranslationKey
value: Hello World
description: A message that is shown on the main page
# etc.
Step 2 - Define an output format
Within mooi
directory, create a config.yaml
file:
# ./mooi/config.yaml
formats:
# We assume that your source code is located in "src" folder
# In this example we are generating a JavaScript file, but you could
# generate TypeScript as well
- outputPath: src/localization/{{languageCode}}/generated.js
format: |
export default {
{{#each translations}}
{{key}}: "{{{value}}}",
{{/each}}
}
Step 3 - Run mooi
Run the following command:
npx mooi-cli translate --openAiKey {YOUR OPEN AI KEY}
As a result, you will see files generated in src/localization/
folder (i.e. src/localization/de/generated.js
Step 4 - Append generated translations to your localization
Now that our translations are generated, we advise you to simply append them to your main localization table.
const strings = new LocalizedStrings({
en:{
...require('src/localization/en/generated'),
// ...
// Your other manually-provided translations
},
de: {
...require('src/localization/de/generated'),
// ...
// Your other manually-provided translations
},
// etc. for other languages
});
And that is it, you are good to go!
Last updated