Vue, how can I use Vue I18n in routre?

Question

Vue.js

Good afternoon.
I want to use title in my router.js file : Vue.i18n.t('about') for the title,
but it doesn't see it.
Can you tell me how it can be connected?

{
    path: '/about',
    component: About,
    meta: { title: Vue.i18n.t('about') }     <--- Не работает
}
с этим подключением в консоле выдает ошибку

Answer 1

your order of initialization is wrong. break everything into files

// i18n.js
import Vue from 'vue'
import VueI18n from 'vue-i18n'
import english from '@/lang/english.js'
import russian from '@/lang/russian.js'

Vue.use(VueI18n)

let messages = {
    en : english,
    ru : russian,
}

export default new VueI18n({
    //locale: 'ru',
    locale: window.localStorage.Language || 'ru',

    fallbackLocale: 'ru',
    messages
})

// router.js
...
import i18n from '@/path/to/i18n.js'
...
{
    path: '/about',
    component: About,
    meta: { title: i18n.t('about') }
}

// main.js
import Vue from 'vue'
import App from './App'
import Vuetify from 'vuetify'
import router from './router'
import axios from 'axios'
import store from './store';
import i18n from '@/path/to/i18n.js'

Vue.config.productionTip = false

Vue.use(Vuetify)

Vue.axios = Vue.prototype.$http = axios.create({
    baseURL: 'http://localhost:5000/api'
})


/* eslint-disable no-new */
new Vue({
    el: '#app',
    i18n,
    router,
    store,
    components: { App },
    template: '<App/>',
    created() {
      this.$vuetify.theme.primary = '#01579B'
    }
})