lunchtime-vue-i18n

介绍

lunchtime-vue-i18n 是一款 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>

<!-- 发布流程 -->
tsc
<!-- ⬇️⬇️⬇️ -->
yarn pack 
<!-- ⬇️⬇️⬇️ -->
 解压
<!-- ⬇️⬇️⬇️ -->
cd package
<!-- 发布到 npm -->
npm publish

js / ts 文件替换

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

// 替换后

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

export const map = {
  key: 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 lunchtime-vue-i18n -D

转化

npx lunchtime-vue-i18n

配置

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

module.exports = {
  entry: 'src/test', // 编译入口文件夹,默认是 src
  outdir: 'src/locales/new', // i18n 输出文件夹 默认是 src/locales
  exclude: ['src/locales/new'], // 不重写的文件夹, 默认是 ['src/locales']
  extensions: ['.vue', '.js', '.ts'], // 重写的文件类型，默认是 ['.js', '.vue', '.ts']
  single: false, // 是否为单文件编译, 默认为 false. 如果为 true, 则 entry 需为文件而不是文件夹, 如 entry: 'src/index.vue'
  filename: '2025.10.13', // 输入的中文 json 文件名,默认为 zh_cn
  useChineseKey: false, // 是否使用中文作为键
  jsConfig: {
    //js配置
    importUrl: 'import i18n from \'@/locales\';',//引入 路径
    useStr:'const t = (i18n.global as any).t;',//使用 语句
    keys: 't',//需要处理的 key 例如：i18n.t('') 中的 t
  },
  vueConfig: {
     //vue配置
    importUrl: 'import { useI18n } from \'vue-i18n\';',//引入 路径
    useStr:'const { t } = useI18n();',//使用 语句
    keys: 't',//需要处理的 key 例如：{{ t('') }} 中的 t
  }
}