i18n-use

介绍

i18n-use 是一套多语言国际化解决方案。具有简单易用、适配任何前端框架、零依赖、精悍强大、高度定制化。压缩后仅不到 2KB，性能优越等特性。当你不需要很复杂的翻译功能，这款通用的语言工具包是不二之选。

安装

npm i i18n-use  -S

# yarn 安装
yarn add i18n-use  -S

快速上手

Vite 框架

main.tsx 入口文件

import "./index.css";
import { createRoot } from "react-dom/client";
import App from "./App.tsx";
import "./i18n"; // 引入多语言

createRoot(document.getElementById("root")!).render(<App />);

i18n目录

// index.ts
import { initI18n, getModuleByMetaGlob } from "i18n-use";

initI18n({
  //locales: getModuleByMetaGlob(import.meta.globEager('./modules/**/*.json')), // vite4以下低版本
  locales: getModuleByMetaGlob(import.meta.glob('./modules/**/*.json', { eager: true })), // 必填项（其他都非必填）
  defaultLocale: 'in', // 默认语言（非必填）
  useLocales: ['en', 'zh', "in"] // 使用的哪些语言（非必填）
}); // 初始化i18n

modules 翻译文件目录

i18n
├─ index.ts        # 初始化多语言
└─ modules
    ├─ login # 登陆页     
      ├─ zh.json   # 中文翻译文件
      ├─ en.json   # 英文翻译文件
      └─ in.json   # 印尼翻译文件
    └─ home # 首页      
      ├─ zh.json   # 中文翻译文件
      ├─ en.json   # 英文翻译文件
      └─ in.json   # 印尼翻译文件

首页 home 的翻译文件

// zh.json - 中文
{
  "姓名": "姓名",
}

// en.json - 英语
{
  "姓名": "Name",
}

// in.json - 印尼语
{
  "姓名": "Nama",
}

页面中使用

// App.tsx
import { useLang, setLanguage, getLanguage } from "i18n-use";

function App() {

  const { 
    t, 
    defaultLocale, 
    locale, 
    locales,
    localeId,
    useLocales 
  } = useLang("home"); // 如果是多个翻译文件，可配置 useLang(["home", "common"]);

  useEffect(()=> {
    const lang = getLanguage(); 
    console.log(lang) // 可通过 getLanguage 方法获取当前语言
    console.log(defaultLocale) // 或通过 defaultLocale 也可以获取
    console.log(locale) // 获取当前语言的所有翻译内容
    console.log(locales) // 获取所有语言的翻译内容
    console.log(localeId) // 获取cookie中的语言标识符
    console.log(useLocales) // 获取正在使用的语言集合，例如["zh", "en", "in"]
  },[])

  return (
    <div>
      <h3>i18n-use 使用例子</h3>
      <span>当前的翻译：{t("姓名")}</span>
      <span>当前的语言：{defaultLocale}</span>
      <span onClick={()=> setLanguage(defaultLocale == "zh" ? "in" : "zh")}>切换语言</span>
    </div>
  )
}
export default App;

Webpack 框架

main.tsx 入口文件

import React from "react";
import ReactDOM from "react-dom/client";
import App from "./App";
import "./i18n"; // 引入多语言

ReactDOM.createRoot(document.getElementById("app") as HTMLElement).render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);


createRoot(document.getElementById("root")!).render(<App />);

i18n目录

// index.tsx
import { initI18n, getModuleByRequireContext } from "i18n-use";

initI18n({
  locales: getModuleByRequireContext(require.context('./modules/', true, /\.json/)),
  defaultLocale: 'in', // 默认语言
  useLocales: ['en', 'zh', "in"] // 使用的哪些语言
}); // 初始化i18n

modules 翻译文件目录 （同上）

options 参数说明

locales

• Type: Object
• Default: {}

所有的翻译文件内容。

defaultLocale

• Type: string
• Default: zh

默认的语言。

locale

• Type: Object
• Default: {}

当前选中的语言翻译内容（例如选中英文en，返回英文翻译内容）。

localeId

• Type: string
• Default: languageId

存在 cookie 里的语言标识符。

useLocales

• Type: Array
• Default: languageCodes

使用到的语言集合（默认集常用的 167 种语言，可参考下面的语言代码）。

常见的 i18n（国际化）语言代码：

languageCodes

en：英语（English）
zh：中文（Chinese）
fr：法语（French）
de：德语（German）
es：西班牙语（Spanish）
it：意大利语（Italian）
ja：日语（Japanese）
ko：韩语（Korean）
pt：葡萄牙语（Portuguese）
ru：俄语（Russian）
ar：阿拉伯语（Arabic）
这只是一小部分常见的语言代码，实际上还有许多其他语言的代码，例如：
nl：荷兰语（Dutch）
sv：瑞典语（Swedish）
th：泰语（Thai）
tr：土耳其语（Turkish）
语言代码通常遵循 ISO 639 标准。在实际的国际化项目中，根据具体的需求，可能需要支持更多种类的语言。
您是在进行国际化相关的开发工作吗？
i18n（国际化）所有的语言代码
以下是较为完整的 ISO 639 语言代码列表，但并非涵盖所有可能的情况：
af：阿非利卡语（Afrikaans）
sq：阿尔巴尼亚语（Albanian）
am：阿姆哈拉语（Amharic）
ar：阿拉伯语（Arabic）
hy：亚美尼亚语（Armenian）
as：阿萨姆语（Assamese）
ay：艾马拉语（Aymara）
az：阿塞拜疆语（Azerbaijani）
bm：班巴拉语（Bambara）
ba：巴什基尔语（Bashkir）
eu：巴斯克语（Basque）
be：白俄罗斯语（Belarusian）
bn：孟加拉语（Bengali）
bh：比哈尔语（Bihari languages）
bi：比斯拉马语（Bislama）
bs：波斯尼亚语（Bosnian）
br：布列塔尼语（Breton）
bg：保加利亚语（Bulgarian）
my：缅甸语（Burmese）
ca：加泰罗尼亚语（Catalan）
ch：查莫罗语（Chamorro）
ce：车臣语（Chechen）
ny：切瓦语（Chewa）
zh：中文（Chinese）
cv：楚瓦什语（Chuvash）
kw：康沃尔语（Cornish）
co：科西嘉语（Corsican）
cr：克里语（Cree）
hr：克罗地亚语（Croatian）
cs：捷克语（Czech）
da：丹麦语（Danish）
dv：迪维希语（Divehi）
nl：荷兰语（Dutch）
dz：宗喀语（Dzongkha）
en：英语（English）
eo：世界语（Esperanto）
et：爱沙尼亚语（Estonian）
ee：埃维语（Ewe）
fo：法罗语（Faroese）
fj：斐济语（Fijian）
fi：芬兰语（Finnish）
fr：法语（French）
fy：弗里西语（Frisian）
ga：爱尔兰语（Irish）
gd：苏格兰盖尔语（Scottish Gaelic）
gl：加利西亚语（Galician）
lg：卢干达语（Ganda）
ka：格鲁吉亚语（Georgian）
de：德语（German）
ki：基库尤语（Kikuyu）
el：希腊语（Greek）
gn：瓜拉尼语（Guarani）
gu：古吉拉特语（Gujarati）
ht：海地克里奥尔语（Haitian Creole）
ha：豪萨语（Hausa）
he：希伯来语（Hebrew）
hz：赫雷罗语（Herero）
hi：印地语（Hindi）
ho：希里莫图语（Hiri Motu）
hu：匈牙利语（Hungarian）
is：冰岛语（Icelandic）
ig：伊博语（Igbo）
id：印尼语（Indonesian）
ia：国际语（Interlingua）
ie：国际辅助语（Interlingue）
iu：因纽特语（Inuktitut）
ik：伊努皮克语（Inupiaq）
ga：爱尔兰语（Irish）
it：意大利语（Italian）
ja：日语（Japanese）
jv：爪哇语（Javanese）
kl：格陵兰语（Kalaallisut）
kn：卡纳达语（Kannada）
kr：卡努里语（Kanuri）
ks：克什米尔语（Kashmiri）
kk：哈萨克语（Kazakh）
km：高棉语（Khmer）
ki：基库尤语（Kikuyu）
rw：卢旺达语（Kinyarwanda）
ko：韩语（Korean）
ku：库尔德语（Kurdish）
kj：宽亚玛语（Kwanyama）
lo：老挝语（Lao）
la：拉丁语（Latin）
lv：拉脱维亚语（Latvian）
li：林堡语（Limburgan）
ln：林加拉语（Lingala）
lt：立陶宛语（Lithuanian）
lb：卢森堡语（Luxembourgish）
mk：马其顿语（Macedonian）
mg：马达加斯加语（Malagasy）
ms：马来语（Malay）
ml：马拉雅拉姆语（Malayalam）
mt：马耳他语（Maltese）
mi：毛利语（Maori）
mr：马拉地语（Marathi）
mh：马绍尔语（Marshallese）
mn：蒙古语（Mongolian）
na：瑙鲁语（Nauru）
nv：纳瓦霍语（Navajo）
nd：北恩德贝勒语（North Ndebele）
ne：尼泊尔语（Nepali）
ng：恩敦加语（Ndonga）
nb：书面挪威语（Norwegian Bokmål）
nn：新挪威语（Norwegian Nynorsk）
no：挪威语（Norwegian）
ii：四川彝语（Nuosu）
oc：奥克语（Occitan）
oj：奥吉布瓦语（Ojibwa）
or：奥里亚语（Oriya）
om：奥罗莫语（Oromo）
os：奥塞梯语（Ossetian）
pa：旁遮普语（Punjabi）
pi：巴利语（Pali）
fa：波斯语（Persian）
pl：波兰语（Polish）
pt：葡萄牙语（Portuguese）
ps：普什图语（Pashto）
qu：克丘亚语（Quechua）
rm：罗曼什语（Romansh）
ro：罗马尼亚语（Romanian）
ru：俄语（Russian）
sm：萨摩亚语（Samoan）
sg：桑戈语（Sango）
sa：梵语（Sanskrit）
sc：撒丁语（Sardinian）
sr：塞尔维亚语（Serbian）
sn：修纳语（Shona）
sd：信德语（Sindhi）
si：僧伽罗语（Sinhala）
sk：斯洛伐克语（Slovak）
sl：斯洛文尼亚语（Slovenian）
so：索马里语（Somali）
st：南索托语（Southern Sotho）
es：西班牙语（Spanish）
su：巽他语（Sundanese）
sw：斯瓦希里语（Swahili）
ss：斯威士语（Swati）
sv：瑞典语（Swedish）
tl：他加禄语（Tagalog）
ty：塔希提语（Tahitian）
tg：塔吉克语（Tajik）
ta：泰米尔语（Tamil）
tt：鞑靼语（Tatar）
te：泰卢固语（Telugu）
th：泰语（Thai）
bo：藏语（Tibetan）
ti：提格里尼亚语（Tigrinya）
to：汤加语（Tonga）
tn：茨瓦纳语（Tswana）
tr：土耳其语（Turkish）
tk：土库曼语（Turkmen）
tw：特威语（Twi）
ug：维吾尔语（Uyghur）
uk：乌克兰语（Ukrainian）
ur：乌尔都语（Urdu）
uz：乌兹别克语（Uzbek）
ve：文达语（Venda）
vi：越南语（Vietnamese）
vo：沃拉普克语（Volapük）
cy：威尔士语（Welsh）
wa：瓦隆语（Walloon）
wo：沃洛夫语（Wolof）
xh：科萨语（Xhosa）
yi：意第绪语（Yiddish）
yo：约鲁巴语（Yoruba）
zu：祖鲁语（Zulu）

更新记录

| 版本号 | 更新时间 | 作者 | 更新说明 | | ------ | --------- | ------ | ------------------------------------------------------------------------------------------------------------------- | | 1.0.0 | 2024.8.07 | 月如影 | 初始化 |