i18n: lazy-loading

front/src/App.vue

@@ -9,6 +9,7 @@
           <div class="three wide column">
             <h4 class="ui header">Links</h4>
             <div class="ui link list">
+              <p>{{ $t('Hello, world!') }}</p>
               <router-link class="item" to="/about">
                 About this instance
               </router-link>
@@ -49,7 +50,8 @@ export default {
     PlaylistModal
   },
   created () {
-    console.log(this.$t('hello'))
+    this.$i18n.i18next.changeLanguage('fr')
+    console.log(this.$t('Hello, world!'))
     this.$store.dispatch('instance/fetchSettings')
     let self = this
     setInterval(() => {

front/src/main.js

@@ -12,7 +12,7 @@ import axios from 'axios'
 import {VueMasonryPlugin} from 'vue-masonry'
 import VueLazyload from 'vue-lazyload'
 import i18next from 'i18next'
-// import i18nextFetch from 'i18next-fetch-backend'
+import i18nextFetch from 'i18next-fetch-backend'
 import VueI18Next from '@panter/vue-i18next'
 import store from './store'
 import config from './config'
@@ -83,21 +83,15 @@ axios.interceptors.response.use(function (response) {
 store.dispatch('auth/check')
 
 // i18n
-i18next.init({
-  lng: 'en',
-  resources: {
-    en: {
-      translation: {
-        'hello': 'Hello'
-      }
-    },
-    fr: {
-      translation: {
-        'hello': 'Bonjour'
-      }
+i18next
+  .use(i18nextFetch)
+  .init({
+    lng: 'en',
+    preload: ['en'],
+    backend: {
+      loadPath: '/static/translations/{{lng}}.json'
     }
-  }
-})
+  })
 const i18n = new VueI18Next(i18next)
 
 /* eslint-disable no-new */

front/static/translations/en.json

@@ -1 +1,3 @@
-{}
+{
+    "Hello, world!": "Hello, world!"
+}

front/static/translations/fr.json

@@ -1 +1,3 @@
-{}
+{
+    "Hello, world!": "Bonjour tout le monde !"
+}

po/en.po

@@ -11,3 +11,6 @@ msgstr ""
 "Content-Type: text/plain; charset=UTF-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 "Plural-Forms: nplurals=2; plural=(n != 1);\n"
+
+msgid "Hello, world!"
+msgstr "Hello, world!"

po/fr.po

@@ -11,3 +11,6 @@ msgstr ""
 "Content-Type: text/plain; charset=UTF-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 "Plural-Forms: nplurals=2; plural=(n > 1);\n"
+
+msgid "Hello, world!"
+msgstr "Bonjour tout le monde !"

po/funkwhale.pot

@@ -11,3 +11,6 @@ msgstr ""
 "Content-Type: text/plain; charset=UTF-8\n"
 "Content-Transfer-Encoding: 8bit\n"
 "Plural-Forms: nplurals=INTEGER; plural=EXPRESSION;\n"
+
+msgid "Hello, world!"
+msgstr "Hello, world!"