中文国际化插件，适用于 vue，react

安装

npm install vue-react-i18n-plugin -D

需同时配置 webpack plugins 和 babel plugins

webpack plugins 配置

// webpack.config.js
const WebpackI18nPlugin = require("vue-react-i18n-plugin");
const i18nConfig = require("./i18n.config.js");

plugins: [
  new WebpackI18nPlugin(i18nConfig),
]

// vue.config.js
chainWebpack: (config) => {
  config
    .plugin('i18n')
    .use('vue-react-i18n-plugin')
    .tap(() => {
      return [i18nConfig];
    });
}

// i18n.config.js
module.exports = {
  translation: {
    en_US: ["./i18n/翻译文件.xlsx"], //en_US语言包
  },
};

babel plugins 配置

// .babelrc or babel.config.js
plugins:[
  "vue-react-i18n-plugin/babel" // 放在最后
]

语言切换

确保语言包最先加载到页面中，中文环境无需引入语言包

// 页面入口 app.js
const en_US = require("./i18n/en_US"); // 对应语言包
window.$i8n.locale(en_US); // $i18n为全局变量

备注

1. 编译结果暴露 $i8n $$i8n 全局方法.关注编译时的日志

2. 如果语言包无法更新，清理node_modules/.cache后重新编译