0.2.8 • Published 6 years ago
i18n-extract-loader v0.2.8
i18n-extract-loader
Webpack loader to extract i18n text into json.
Install
npm i -D i18n-extract-loader
Usage
webpack.config.js
module.exports = {
module: {
rules: [
{
test: /\.jsx?$/,
use: [
'ts-loader',
{
loader: 'i18n-extract-loader',
options: {
locale: 'en-us',
},
},
],
},
];
}
}
Options
locale
执行的语言参数, e.g.zh-cn
- type:
string
- defaut:
en-us
- type:
pattern
多语定界符- type:
RegExp
- defaut:
/__\((.+?)\)/g
- type:
isExtract
是否执行抽取,此操作会清空本地的变更语言文件,生成新的变更语言文件- type:
bool
- defaut:
false
- type:
isTranslate
是否执行替换操作,将变更语言文件中的翻译同步到组件的语言文件中- type:
bool
- defaut:
false
- type:
debug
调试模式,打印执行信息- type:
bool
- defaut:
false
- type:
Workflow
工具一共会产生三种文件:
- 组件多语文件,文件级别的语言文件,位于文件同级目录下的
__i18n__
文件夹 - 全局缓存语言文件,位于项目根目录
.i18n-cache
下,不提交,存放项目所有文案 - 全局变更语言文件,位于项目根目录
__i18n__
,不提交,存放本次新增文案
假如配置 npm script 如下:
{
"scripts":{
"dev": "webpack --config webpack.dev.js",
"extract": "npm run dev -- --env.isExtract=true --env.locale=all",
"translate": "npm run dev -- --env.isTranslate=true --env.locale=all",
}
}
文案新增及更新
代码中新增了文案,或者将代码中原有文案进行了更新。
- 新增文案,执行
npm extract
会清空本地的变更文件,将组件中文案抽取到缓存及组件的多语文件中,如果缓存中不存在或者文案不一样,同时会抽取到变更文件中; - 将生成的变更多语文件进行翻译,执行
npm translate
。会将变得文件中的翻译同步到缓存及组件多语文件中。
更新某个翻译文案
比如需要更新某个文案的英文翻译,直接更改该文案所在组件的多语文件。非中文的文案直接在代码中修改,生成一条新的文案,而不是修改语言文件。
TODOs
- time, currency, plural localization support
- file split, sotre the merged file into cache