解释与说明
i18n,全名是 internationalization,称为国际化。即语言转换,让以其他语言作为母语的人能看懂前端中的文字。
常用的就是中文简体(zh_CN)与英文(美国)(en_US)的转换,也可以增添中文繁体(zh_TW)等其他语言。
缩写的由来
internationalization,首字母 i 和末字母 n 之间有 18 个字母,故缩写为 i18n。
与之对应的是 L10n,本地化,Localization。
最好在项目初期就计划使用国际化,这样相对后期使用会大大减少工作量。
项目使用
安装
- 打开控制台
- 进入前端的文件夹
cd web
- 使用下载安装命令
npm install vue-i18n
也可以使用 yarn:
yarn add vue-i18n
使用
第一步,创建语言库。
- 在 src 文件夹下创建一个文件夹 locales;
- 再在 locales 文件夹下创建要转换成的语言文件;
- 在 src 文件夹下创建 i18n.js 文件。
注意 i18n.js 文件是与 locales 文件夹同级的,都在 src 文件夹下。
需要的是中文简体和英文(美国),所以是 zh-CN.json 和 en-US.json。
第二步,在相应创建的文件夹下写入代码。
- 在 zh-CN.json 文件中添加代码:
{
"common": {
"confirm": "确定",
"cancel": "取消",
"pleaseEnterUsernameAndPassword": "请输入账号和密码",
"loginSuccess": "登录成功",
"loginFail": "登录失败"
},
"loginPage": {


