1、安装
npm install vue-i18n / npm install vue-i18n --save / npm install vue-i18n@8.0.0
2、在main.js中引入（引入有很多写法，此处暂时记录我使用的一种）
此处import的文件是自己在src下创建的,注意自己的路径不要写错了
import i18n from './i18n/i18n'// 国际化封装
new Vue({
store,
router,
i18n,
render: h => h(App)
}).$mount('#app')
3、编写i18n文件
在src下创建i18n文件夹，再创建子文件夹lang和子文件i18n.js
i18n文件详解
1、配置文件
文件源码放在了文章末尾噢
2、入口文件
在lang下创建两个文件夹，一个是cn，一个是en，分别用来存放中文和英文js文件。
当然，你还可以继续在cn下创文件夹，方便管理。
cn和en下都有一个index.js文件,也就是入口文件，两者内容中的取名要保持一致，引入的文件里面的数据也要相对应
3、基本文件
基本文件也是一一对应的，比如入口文件引入的labels: require('./labels.js'),
4、使用方法
this.$t('labels.rememberMe');
这样就完成啦，不同模块可以有重名噢，也就是说以下两种是不同的
this.$t('labels.rememberMe');
this.$t('buttons.rememberMe');
源码
i18n配置文件
/* eslint-disable */
import Vue from 'vue'
import VueI18n from 'vue-i18n'
import locale from 'element-ui/lib/locale';//elementUI的国际化
import cn from './langs/cn/index'
import en from './langs/en/index'
import enLocale from 'element-ui/lib/locale/lang/en'
import zhLocale from 'element-ui/lib/locale/lang/zh-CN'
Vue.use(VueI18n)
const messages = {
en: Object.assign(en, enLocale),// 使用ES6展开挂载自定义中英文和element UI中英文
zh: Object.assign(cn, zhLocale)
}
const i18n = new VueI18n({
locale: localStorage.lang || 'zh',// 语言标识
messages, // 挂载
silentTranslationWarn: true, //控制台屏蔽讲警告
})
locale.i18n((key, value) => i18n.t(key, value)) //为了实现element插件的多语言切换
export default i18n
