愿景

September 6, 2025 · View on GitHub

开箱即用的轻量级 Vue 国际化自动翻译解决方案

English | 简体中文

demo

愿景
 要求
 特性
 Live Demo
原理
 License

愿景

为了让接入国际化成为轻松且愉快的事😄💪🏻

要求

当前库仅适用于 Vue 2 , 需要支持 Vue 3 的请点击 i18n-pro/vue 查看

vue >= 2.0.0 < 3.0.0
i18n-pro >= 3.0.0 < 4.0.0

特性

轻量： +
以下特性继承于 i18n-pro
- 简单
- 灵活
- 自动翻译
- keyless

Live Demo

with$ = true
- Open in CodeSandbox
with$ = false
- Open in CodeSandbox

原理

该库是基于 i18n-pro 结合 Vue 的 原型属性、响应式机制和插件机制 来实现的

主要由 1 部分构成

createI18n

createI18n：初始化国际化状态并返回其插件函数

简易示例如下

// App.vue
<template>
  {/** 文案即 key */}
  <div>{{ $t('hello world') }}</div>
  {/** 自定义 key */}
  <div>{{ $t.t('custom-key', 'hello world') }}</div>
</template>

// main.ts
import Vue from 'vue'
import App from './App.vue'
import { createI18n } from '@i18n-pro/vue2'

const i18n = createI18n({
  namespace: "i18n-example",
  locale: "en",
  langs: {
    zh: {
      'hello world': '你好世界',
      'custom-key': '你好世界',
    },
    ja:{
      "hello world": "こんにちは世界",
      'custom-key': 'こんにちは世界',
    },
  }
})

Vue.use(i18n)

new Vue({
  el: '#app',
  render: h => h(App)
})

帮助文档

为了避免不必要的重复文档内容，该库的部分文档是链接 i18n-pro 中的内容
当前文档中 i18n-pro 相关链接是基于 3.0.0 版本，如果你使用的非该版本，需查看你所使用版本对应的文档，以免用法不一致

当前库
i18n-pro

License

MIT