diff options
author | Patrick Williams <patrick@stwcx.xyz> | 2022-12-08 15:13:13 +0300 |
---|---|---|
committer | Patrick Williams <patrick@stwcx.xyz> | 2022-12-08 15:13:13 +0300 |
commit | 7385e139b0c9efca7430458cee982e63e282f4ae (patch) | |
tree | 1bbdb0164e556b76eec72cb558c66974c8f95dd8 /docs/guide/guidelines/internationalization.md | |
parent | b24a483eda5ca0b0ecdb4f0c61b90d76d0d8e1e0 (diff) | |
download | webui-vue-7385e139b0c9efca7430458cee982e63e282f4ae.tar.xz |
prettier: re-format
Prettier is enabled in openbmc-build-scripts on Markdown, JSON, and YAML
files to have consistent formatting for these file types. Re-run the
formatter on the whole repository.
Change-Id: I2804ee3ab5ff6bcbf986b028db2fafec8e616779
Signed-off-by: Patrick Williams <patrick@stwcx.xyz>
Diffstat (limited to 'docs/guide/guidelines/internationalization.md')
-rw-r--r-- | docs/guide/guidelines/internationalization.md | 42 |
1 files changed, 24 insertions, 18 deletions
diff --git a/docs/guide/guidelines/internationalization.md b/docs/guide/guidelines/internationalization.md index 6ff17d76..7afc4598 100644 --- a/docs/guide/guidelines/internationalization.md +++ b/docs/guide/guidelines/internationalization.md @@ -1,41 +1,48 @@ # Internationalization + The OpenBMC Web UI implements internationalization and separates the language- -specific parts of the interface from the rest of the code, so they can be -easily replaced. The OpenBMC Web UI uses the following library for +specific parts of the interface from the rest of the code, so they can be easily +replaced. The OpenBMC Web UI uses the following library for internationalization: + - [Vue I18n](https://kazupon.github.io/vue-i18n/introduction.html) ## Key naming convention + The OpenBMC Web UI follows the following key naming conventions: - Page specific labels should be nested in an object with a key prefixed `page` -followed by the page title. Formatting in this manner provides a systematic -structure and improves readability of the language file. - - e.g. `pageLocalUserManagement.editUser` + followed by the page title. Formatting in this manner provides a systematic + structure and improves readability of the language file. + - e.g. `pageLocalUserManagement.editUser` - Any 'major' child components should be nested inside page specific objects -(ex. table, modal) - - e.g. `pageEventLogs.table.eventType` + (ex. table, modal) + - e.g. `pageEventLogs.table.eventType` - Avoid any complex linked locale messages. - Alphabetize object keys. This helps in locating the keys. - We use the `$t()` function in markup and `this.$t` in scripts (which Vue I18n -provides to our components) for outputting translation messages. + provides to our components) for outputting translation messages. ## Using the Vue I18n plugin -- A new `src/i18n.js` file is added and it registers Vue I18n as a plugin to -our Vue instance via the `Vue.use()` function. + +- A new `src/i18n.js` file is added and it registers Vue I18n as a plugin to our + Vue instance via the `Vue.use()` function. - The CLI creates a `src/locales/en-US.json` file, which contains our default -translation messages. + translation messages. - The keys are placed in the `src/locales/en-US.json` file and then the `$t()` -function is used to output the translation messages. + function is used to output the translation messages. - After adding or removing calls to `$t` please run this to ensure consistent -English translation (note: using variable expansion in key names is not -handled automatically, you need to manually check them): + English translation (note: using variable expansion in key names is not + handled automatically, you need to manually check them): + ```bash node node_modules/vue-i18n-extract/bin/vue-i18n-extract.js -v 'src/**/*.?(js|vue)' -l 'src/locales/en-US.json' ``` + - If you're working on updating a translation for another language (e.g. -Russian), run this to see the omissions (as well as cruft) and add the -necessary keys automatically: + Russian), run this to see the omissions (as well as cruft) and add the + necessary keys automatically: + ```bash node node_modules/vue-i18n-extract/bin/vue-i18n-extract.js -v 'src/**/*.?(js|vue)' -l 'src/locales/ru-RU.json' -a ``` @@ -51,8 +58,7 @@ node node_modules/vue-i18n-extract/bin/vue-i18n-extract.js -v 'src/**/*.?(js|vue ``` - Vue I18n’s `$tc()` function can help with displaying plurals. -[Learn more about -pluralization.](https://kazupon.github.io/vue-i18n/guide/pluralization.html) + [Learn more about pluralization.](https://kazupon.github.io/vue-i18n/guide/pluralization.html) ```json "modal": { |