Internationalize your application

SHrub is wrapping vue-i18n plugin. You can follow the documentation

Add language files

Create one file per language in /src/locales/[lang].yml

Locale files are simply pair of key values written in YAML that can also be nested:

messages:
  welcome: Welcome to your SHrub app!
locales:
  fr: French
  en: English

Configure plugin

Pass an array of locales to the plugin

Vue.use(i18n, ['en', 'fr'])

Use the plugin

<p>{{ $t("message.welcome") }}</p>

See the documentation here

Component properties and methods

The wrapper inject a few properties and methods in the component instances

lang

Current lang in use. For example : en. You can set it to globally update locale in use.

locales

Read-only returns an array of locales (the same passed as an argument in Vue.use)

setLang (lang)

Helper that set this.lang to be used in a template

<button @click="setLang(lang)" v-for="lang in locales">{{ lang }}</button>

isLang (lang)

Helper that test if argument is current lang.