作为一名前端开发，给项目做多语言早已是家常便饭。

可每次面对成百上千条文案，“一行行手动翻译 + 维护 N 个 JSON 文件”仍然是让人头秃的体力活。

🎯i18n-auto-extractor

用 $at() 包一层，剩下的交给机器人

• 安装即可跑，零配置开箱即用

• Vue、React、原生项目全部通吃

• 内置谷歌翻译，支持 100+ 语言

• 极小包体，运行时动态切换语言

使用 3 步走

复制 1npm i -D i18n-auto-extractor
 2npx i18n-auto-extractor   # 生成配置文件

复制 1// 代码里包一层即可
 2const title = $at('欢迎来到我的网站')

构建后会自动生成：

复制 1locales/
 2├─ zh.json   // 原中文
 3├─ en.json   // 自动翻译
 4├─ fr.json   // ...

🎯auto-i18n-translation-plugins

连 $t() 都不用写，源码中文自动翻译

• 完全零侵入，Babel 扫描无需改代码

• Vite / Webpack / Rollup 插件形态全覆盖

• Google、有道、百度翻译源任意切换

• 增量构建，只翻译新增文案省流量

npm i -D vite-auto-i18n-plugin@^1.0.23

使用示例（Vite）

npm i -D vite-auto-i18n-plugin@^1.0.23

复制 1// vite.config.ts
 2import viteAutoI18n from 'vite-auto-i18n-plugin'
 3
 4export default defineConfig({
 5  plugins: [
 6    vue(),
 7    viteAutoI18n({
 8      targetLangList: ['en', 'ja', 'ko'],
 9      translator: new YoudaoTranslator({ appId: 'xxx', appKey: 'xxx' })
10    })
11  ]
12})

构建完成后自动生成 lang/index.json，直接引入即可使用。

🎯i18n-cli

命令行一把梭，老项目 5 分钟上线多语言

• CLI 一键扫描并替换中文为 t(‘xxx’)

• Excel 导入导出，翻译团队协作零门槛

• 支持百度、谷歌、有道多翻译源

• 增量模式仅处理新增文案，避免重复劳动

使用 2 步走

复制 1npm i -g @ifreeovo/i18n-extract-cli
 2it --locales en,ja        # 全量翻译
 3it --incremental          # 仅增量

产物示例：

复制 1// locales/zh-CN.json
 2{ "a1b2c3": "提交订单" }
 3
 4// locales/en.json
 5{ "a1b2c3": "Submit Order" }

🎯 场景速选指南

场景	推荐工具	理由
新项目，想持续维护	i18n-auto-extractor	有侵入，但长期可维护
老项目 2 天上线英文版	auto-i18n-translation-plugins	完全不改动源码
需要产品/翻译团队介入	i18n-cli	CLI + Excel 协作最顺畅

Github 地址

• i18n-auto-extractor：https://github.com/qianyuanjia/i18n-auto-extractor

• auto-i18n-translation-plugins：https://github.com/auto-i18n/auto-i18n-translation-plugins

• i18n-cli：https://github.com/IFreeOvO/i18n-cli