calidion/node-i18n-vue

i18n for vue

I18n plugin for vue

demo

1. Import

import {
  VueI18n,
  HTTPLoader
} from "node-i18n-vue";

2. Prepare data:

const options = {
  current: 'en',
  url: "http://localhost:8080/locales/",
  loader: HTTPLoader
};

3. Use plugin

Vue.use(VueI18n, {
  options,
});

or if you want locales to be saved, your can use storage whith window.localStorage/localStorage:

Vue.use(VueI18n, {
  options,
  storage: window.localStorage
});

4. Init data

let i18n = Vue.getI18n();

i18n.init().then(() => {
  // Init your Vue here
  // new Vue({
  //   render: h => h(App),
  // }).$mount('#app')
});

// or

await i18n.init();
/// your Vue mount code
...

5. Listen and update on locale change

i18n.listen(() => {
  // Put you update code here

  // Currently Vue global update seems not available, use page reloading
  // This is an example on update i18n for Vue
  window.location.reload();
});