Skip to content

zxpsuper/vue-i18n-transform

Repository files navigation

vue-i18n-transform

介绍

vue-i18n-transform 是一款 vue-i18n 批量转换文件,目前仅支持替换中文

vue 文件替换

<!-- 替换前 -->
<i :class="{ selected: tabactiveName === 1 }" @click="handleTabClick(1)">
  <span>效果图</span>
</i>

<!-- 替换后 -->
<i :class="{ selected: tabactiveName === 1 }" @click="handleTabClick(1)">
  <span>{{$t('filename_1')}}</span>
</i>

js / ts 文件替换

// 替换前
export const map = {
  key: '替换前'
}

// 替换后

import i18n from '../locales/index.js'

export const map = {
  key: i18n.t('filename_2')
}

生成 locales/zh_cn.json 文件

{
  "filename_1": "效果图",
  "filename_2": "替换前"
}

生成 locales/index.js 文件

import VueI18n from 'vue-i18n'
import Vue from 'vue'
import zh from './zh_cn.json'

Vue.use(VueI18n)

export default new VueI18n({
  locale: 'zh',
  messages: {
    zh
  }
})

需手动将 VueI18n 导入入口文件中使用

import i18n from './locales/index.js'

new Vue({
  i18n,
  router,
  store
})

安装

npm install vue-i18n-transform -D

转化

npx vue-i18n-transform

配置

以下是默认配置, 当然你也可以在项目文件夹下创建 vue-i18n-transform.config.js 文件, 按下面的配置修改你的自定义配置

module.exports = {
  entry: 'src', // 编译入口文件夹,默认是 src
  outdir: 'src/locales', // i18n 输出文件夹 默认是 src/locales
  exclude: ['src/locales'], // 不重写的文件夹, 默认是 ['src/locales']
  extensions: ['.vue', '.js', '.ts'], // 重写的文件类型,默认是 ['.js', '.vue', '.ts']
  single: false, // 是否为单文件编译, 默认为 false. 如果为 true, 则 entry 需为文件而不是文件夹, 如 entry: 'src/index.vue'
  filename: 'zh_cn', // 输入的中文 json 文件名,默认为 zh_cn
  useChineseKey: false // 是否使用中文作为键
}

问题&建议

如果你有任何问题,可以给我发邮件(zxpscau@163.com),或者给项目提 issue.