nuxtjs-i18n + element 国际化

nuxtjs-i18n新版可以通过在nuxt.config.js设定国际化，并不需要我们自己引入i18n进行处理

//nuxt.config.js
export default {
 plugins: [
   '@/plugins/element-ui'
 ],
 i18n: {
    locales: [
      { code: 'en', name: 'English', file: 'en-US.js' },
      { code: 'zh', name: '中文', file: 'zh-CN.js' },
    ],
    lazy: true,
    langDir: 'lang/',
    defaultLocale: 'zh',
    detectBrowserLanguage: {
      useCookie: true,
      cookieKey: 'i18n_abwallet',
      redirectOn: 'root',
    },
  },
}

只需要建立lang文件夹，添加语言包即可

lang/en-US.js
lang/zh-CN.js

通常我们是在这两个文件中添加自己定义的语言包

当我们需要引入第三方插件的语言包时（比如element），我们是通过vue-i18n去进行配置

现在的话直接把语言包合并在lang文件夹下对应的文件中即可

// en-US.js
import enLocale from 'element-ui/lib/locale/lang/en'

const en = {
  title: 'title',
}
export default Object.assign(en, enLocale)

最后在引入第三方插件的时候，根据i18n的语言进行切换

// plugins/element-ui.js

import Vue from 'vue'
import Element from 'element-ui'
import elementLocale from 'element-ui/lib/locale'

Vue.use(Element)

export default ({ app }) => {
  elementLocale.i18n((key, value) => app.i18n.t(key, value))
}