vue i18n懒加载所需的语言

场景，项目有多国语言，语言包容量越来越大，导致打包侯app.js体积很大，首屏渲染速度变慢。

/i18n/index.js ：

import {
    getLanguage
} from "@/utils"
import {
    ZHCN
} from "@/utils/languageKey.js"
import Vue from 'vue'
import VueI18n from 'vue-i18n'
import Vant, {
    Locale
} from 'vant'
Vue.use(VueI18n)
// 获取语言
const lang = getLanguage()
// 装载语言
const messages = {}
const i18n = new VueI18n({
    locale: lang,
    messages: messages,
    fallbackLocale: ZHCN, // 缺省语言 map表没有对应语言 使用该默认语言
    silentTranslationWarn: true,
    missing: (locale, key) => {
        console.log('语言map表缺失该语言', locale, key)
    }
})
Vue.use(Vant, {})
//重点：import 函数，动态变化路径`./${lang}/index.js`
import( /*webpackChunkName:"language_pack"*/ `./${lang}/index.js`).then((languagePack) => {
    i18n.setLocaleMessage(lang, {
        ...languagePack.default
    });
    i18n.locale = lang
    Locale.use(lang, messages[lang]) // 设置第三方框架(vant)语言
});
export default i18n

main.js：

将 i18n 挂载在 vue 根实例上
import i18n from "./i18n";
new Vue({
  el: '#app',
  i18n,
  components: { App },
  template: '<App/>'
})