问题描述
首先我向你展示什么是有效的(在 App.js 中)
First of all I show you what works (in App.js)
import router from './routes.js';
import VueI18n from 'vue-i18n';
const messages = {
en: {
message: {
hello: 'hello world'
}
}
}
// Create VueI18n instance with options
const i18n = new VueI18n({
locale: 'en', // set locale
messages, // set locale messages
})
const app = new Vue({
el: '#app',
router,
i18n
});
但是如果我想在 lang.js 中分离代码
But if I want to separate the code in lang.js
import VueI18n from 'vue-i18n';
const messages = {
en: {
message: {
hello: 'hello world'
}
}
}
export default new VueI18n({
locale: 'en', // set locale
messages, // set locale messages
});
这样我就可以在 App.js 中编写
So that I can write in App.js
import router from './routes.js';
import i18n from './lang.js';
const app = new Vue({
el: '#app',
router,
i18n
});
但不知何故,即使 routes.js 构建完全相同,这也不起作用.
But somehow this doesn't work even though routes.js is built exact the same.
我的 bootstrap.js 看起来像那样,如果知道很重要的话.
My bootstrap.js looks like that, if it is important to know.
import Vue from 'vue';
window.Vue = Vue;
import VueRouter from 'vue-router';
import VueI18n from 'vue-i18n';
Vue.use(VueRouter);
Vue.use(VueI18n);
我很抱歉代码太长,但不知何故错误在于 import i18n from './lang.js';我收到消息:未捕获的类型错误:无法读取未定义的属性 'config'
I'm sorry for the long code, but somehow the mistake lies in import i18n from './lang.js';I get the message: Uncaught TypeError: Cannot read property 'config' of undefined
推荐答案
在您创建应用程序实例的主文件中添加 i18n 作为选项而不是 Vue.use(Vuei18n)
像这样:
In your main file where you create the app instance add the i18n as option instead of Vue.use(Vuei18n)
like this:
new Vue({
el: '#app',
i18n, // < --- HERE
store,
router,
template: '<App/>',
components: { App }
})
放在el
之后;
这应该是你的语言:
import Vue from 'vue'
import VueI18n from 'vue-i18n'
import en from './en'
import fr from './fr'
import ro from './ro'
Vue.use(VueI18n)
export default new VueI18n({
locale: 'en',
fallbackLocale: 'en',
messages: {
en, fr, ro
}
})
这篇关于Vue-i18n - 无法读取未定义的属性“config"的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!