# 中文国际化插件，适用于 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后重新编译