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 mooiWithin 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