按需加载 iview 情况下 使用vue-i18n报错

Question

没有直接使用 iview ,是按需加iview载组件,使用vue-i18n报错
Error in render function: "TypeError: __WEBPACK_IMPORTED_MODULE_2_vue__.default.locale is not a function"
还会有些警告：
[vue-i18n] Value of key 'i.select.noMatch' is not a string!
[vue-i18n] Cannot translate the value of keypath 'i.select.noMatch'. Use the value of keypath as default
[vue-i18n] Value of key 'i.select.loading' is not a string!
...

main.js
import Vue from 'vue'
import App from './App'
import router from './router'
import VueMarkdown from 'vue-markdown'
//import iView from 'iview'
//import 'iview/dist/styles/iview.css'
import VueQuillEditor from 'vue-quill-editor'
import IEcharts from 'vue-echarts-v3';
import '!style-loader!css-loader!less-loader!./mtheme/index.less'; 
//require('!style-loader!css-loader!less-loader!./mtheme/index.less');
import VueI18n from 'vue-i18n'
//Vue.use(iView)
Vue.use(VueMarkdown)
Vue.use(IEcharts)
Vue.use(VueI18n)
const messages = {
  en: {
    message: {
      hello: 'world hello'
    }
  },
  zh: {
    message: {
      hello: '世界'
    }
  }
}

const i18n = new VueI18n({
  locale: 'zh',
  messages
})

//Vue.locale = (locale)=>{}

Vue.config.productionTip = false

new Vue({
    el: '#app',
    router,
    i18n,
    VueMarkdown,
    template: '<App/>',
    components: { App }
    //rander:h=>h(App)
})


index.js这样引用的
import { Button,Icon , Menu ,Row,Col,Breadcrumb} from 'iview';

Answer 1

解决了吗？我也遇到了
不知怎么搞啊

Answer 2

Use the value of keypath as default 警告是因为源数据中存在空的情况，导致语言列表中有空值。$t找不到对应的key。

去查查语言列表所对应的locales数据吧。

Answer 3

重新查看了官网文档，我按如下写的，可以正常使用

Vue.use(iView);
Vue.use(VueI18n);

// 自动设置语言
const navLang = navigator.language;
const localLang = (navLang === 'zh-CN' || navLang === 'en-US') ? navLang : false;
const lang = window.localStorage.getItem('language') || localLang || 'zh-CN';
Vue.config.lang = lang;
Vue.config.productionTip = false;
// 多语言配置
const locales = Locales;
const mergeZH = Object.assign(zhLocale, locales['zh-CN']);
const mergeEN = Object.assign(enLocale, locales['en-US']);
Vue.locale = () => {};
const i18n = new VueI18n({
  locale: 'en-US',    // 语言标识
  messages: {
    'zh-CN': mergeZH,   // 中文语言包
    'en-US': mergeEN    // 英文语言包
  },
})

Answer 4

let i18n = new VueI18n({
  locale: lang,
  // fallbackLocale: lang,
  messages: {....
  },
  silentTranslationWarn: true . //看这里<=====
})