update
This commit is contained in:
parent
ba9f9bfd49
commit
8ae7b68083
@ -6,7 +6,7 @@
|
|||||||
import { t } from "./languages"
|
import { t } from "./languages"
|
||||||
```
|
```
|
||||||
|
|
||||||
由于默认情况下,`voerkai18 compile`命令会在当前工程的`/languages`文件夹下,这样我们为了导入`t`翻译函数不得不使用各种相对引用,这即容易出错,又不美观,如下:
|
由于默认情况下,`t`函数位于当前工程的`/languages`文件夹下,这样我们为了导入`t`翻译函数不得不使用各种相对引用,这即容易出错,又不美观,如下:
|
||||||
|
|
||||||
```javascript | pure
|
```javascript | pure
|
||||||
import { t } from "./languages"
|
import { t } from "./languages"
|
||||||
@ -17,9 +17,9 @@ import { t } from "../../../languages"
|
|||||||
|
|
||||||
作为国际化解决方案,一般工程的大部份源码中均会使用到翻译函数,这种使用体验比较差。
|
作为国际化解决方案,一般工程的大部份源码中均会使用到翻译函数,这种使用体验比较差。
|
||||||
|
|
||||||
为此,我们提供了几个插件可以来自动完成翻译函数的自动导入,包括:
|
为此,我们提供了插件可以来自动完成翻译函数的自动导入,包括:
|
||||||
|
|
||||||
- `babel`插件
|
- (`babel`插件)[../tools/babel]
|
||||||
- `vite`插件
|
- (`vite`插件)[../tools/vite]
|
||||||
|
|
||||||
当启用了`babel/vite`插件后,就会在编译时自动导入`t`函数。关于插件如何使用请参阅文档。
|
当启用了`babel/vite`插件后,就会在编译时自动导入`t`函数。关于插件如何使用请参阅文档。
|
||||||
|
@ -20,7 +20,7 @@
|
|||||||
```javascript | pure
|
```javascript | pure
|
||||||
//idMap.js
|
//idMap.js
|
||||||
{
|
{
|
||||||
"1":"中华人民共和国万岁"
|
"中华人民共和国万岁":"1"
|
||||||
}
|
}
|
||||||
// en.js
|
// en.js
|
||||||
{
|
{
|
||||||
@ -32,13 +32,13 @@
|
|||||||
}
|
}
|
||||||
```
|
```
|
||||||
|
|
||||||
如此,就消除了在`en.js`、`jp.js`文件中的冗余。但是在源代码文件中还存在`t("中华人民共和国万岁")`,整个运行环境中存在两份副本,一份在源代码文件中,一份在`idMap.js`中。
|
如此,就消除了在`en.js`、`jp.js`文件中的冗余。但是在源代码文件中还存在`t("中华人民共和国万岁")`,整个运行环境中存在两份副本,一份在`源代码`文件中,一份在`idMap.js`中。
|
||||||
|
|
||||||
为了进一步减少重复内容,因此,我们需要将源代码文件中的`t("中华人民共和国万岁")`更改为`t("1")`,这样就能确保无重复冗余。但是,很显然,我们不可能手动来更改源代码文件,这就需要由`voerkai18n`提供的一个编译期插件来做这一件事了。
|
为了进一步减少冗余内容,因此,我们需要将源代码文件中的`t("中华人民共和国万岁")`更改为`t("1")`,这样就能确保无重复冗余。但是,很显然,我们不可能手动来更改源代码文件,这就需要由`voerkai18n`提供的一个编译期插件来做这一件事了。
|
||||||
|
|
||||||
以`babel-plugin-voerkai18n`插件为例,该插件同时还完成一份任务,就是自动读取`voerkai18n compile`生成的`idMap.js`文件,然后将`t("中华人民共和国万岁")`自动更改为`t("1")`,这样就完全消除了重复冗余信息。
|
以`babel-plugin-voerkai18n`插件为例,该插件同时还完成一项任务,就是自动读取`voerkai18n compile`生成的`idMap.js`文件,然后将`t("中华人民共和国万岁")`自动更改为`t("1")`,这样就完全消除了重复冗余信息。
|
||||||
|
|
||||||
所以,在最终形成的代码中,实际上每一个t函数均是`t("1")`、`t("2")`、`t("3")`、`...`、`t("n")`的形式,最终代码还是采用了用`key`来进行转换,只不过这个过程是自动完成的而已。
|
所以,在最终形成编译后的代码中,实际上每一个t函数均是`t("1")`、`t("2")`、`t("3")`、`...`、`t("n")`的形式,最终代码还是采用了用`key`来进行转换,只不过这个过程是自动完成的而已。
|
||||||
|
|
||||||
**注意:**
|
**注意:**
|
||||||
|
|
||||||
|
@ -2,7 +2,7 @@
|
|||||||
| 包| 版本号| 最后更新|说明|
|
| 包| 版本号| 最后更新|说明|
|
||||||
| --- | :---:| --- |---|
|
| --- | :---:| --- |---|
|
||||||
|**@voerkai18n/utils**|1.0.12|2022/08/05|公共工具库
|
|**@voerkai18n/utils**|1.0.12|2022/08/05|公共工具库
|
||||||
|**@voerkai18n/runtime**|1.0.28|2022/08/07|核心运行时
|
|**@voerkai18n/runtime**|1.0.29|2022/08/16|核心运行时
|
||||||
|**@voerkai18n/formatters**|1.0.6|2022/04/15|格式化器,提供对要翻译文本的转换功能
|
|**@voerkai18n/formatters**|1.0.6|2022/04/15|格式化器,提供对要翻译文本的转换功能
|
||||||
|**@voerkai18n/react**|1.0.4|2022/04/16|React支持,提供语言切换等功能
|
|**@voerkai18n/react**|1.0.4|2022/04/16|React支持,提供语言切换等功能
|
||||||
|**@voerkai18n/cli**|1.0.33|2022/08/07|命令行工具,用来初始化/提取/编译/自动翻译等工具链
|
|**@voerkai18n/cli**|1.0.33|2022/08/07|命令行工具,用来初始化/提取/编译/自动翻译等工具链
|
||||||
|
@ -55,7 +55,7 @@ this.i18n = {
|
|||||||
|
|
||||||
注入`i18n`实例后就可以在此基础上实现`激活语言`、`默认语言`、`切换语言`等功能。
|
注入`i18n`实例后就可以在此基础上实现`激活语言`、`默认语言`、`切换语言`等功能。
|
||||||
|
|
||||||
```vue
|
```javascript | pure
|
||||||
<script>
|
<script>
|
||||||
import {reactive } from 'vue'
|
import {reactive } from 'vue'
|
||||||
export default {
|
export default {
|
||||||
|
@ -4,7 +4,7 @@
|
|||||||
|
|
||||||
假设一个大型项目,其中源代码文件有上千个。默认情况下,`voerkai18n extract`会扫描所有源码文件将需要翻译的文本提取到`languages/translates/default.json`文件中。由于文件太多会导致以下问题:
|
假设一个大型项目,其中源代码文件有上千个。默认情况下,`voerkai18n extract`会扫描所有源码文件将需要翻译的文本提取到`languages/translates/default.json`文件中。由于文件太多会导致以下问题:
|
||||||
|
|
||||||
- 内容太多导致`default.json`文件太大,有利于管理
|
- 内容太多导致`default.json`文件太大,不利于管理
|
||||||
- 有些翻译往往需要联系上下文才可以作出更准确的翻译,没有适当分类,不容易联系上下文。
|
- 有些翻译往往需要联系上下文才可以作出更准确的翻译,没有适当分类,不容易联系上下文。
|
||||||
|
|
||||||
因此,引入`名称空间`就是目的就是为了解决此问题。
|
因此,引入`名称空间`就是目的就是为了解决此问题。
|
||||||
|
@ -51,7 +51,7 @@ import { t } from "../../../languages"
|
|||||||
|
|
||||||
导入`t`函数后就可以直接使用了。
|
导入`t`函数后就可以直接使用了。
|
||||||
|
|
||||||
```vue
|
```javascript | pure
|
||||||
<Script setup>
|
<Script setup>
|
||||||
// 如果没有在vite.config.js中配置`@voerkai18n/vite`插件,则需要手工导入t函数
|
// 如果没有在vite.config.js中配置`@voerkai18n/vite`插件,则需要手工导入t函数
|
||||||
// import { t } from "./languages"
|
// import { t } from "./languages"
|
||||||
@ -101,17 +101,17 @@ export default {
|
|||||||
引入`@voerkai18n/vue`插件来实现切换语言和自动重新渲染的功能。
|
引入`@voerkai18n/vue`插件来实现切换语言和自动重新渲染的功能。
|
||||||
|
|
||||||
```javascript | pure
|
```javascript | pure
|
||||||
import { createApp } from 'vue'
|
import { createApp } from 'vue'
|
||||||
import Root from './App.vue'
|
import Root from './App.vue'
|
||||||
import i18nPlugin from '@voerkai18n/vue'
|
import i18nPlugin from '@voerkai18n/vue'
|
||||||
import { i18nScope } from './languages'
|
import { i18nScope } from './languages'
|
||||||
const app = createApp(Root)
|
const app = createApp(Root)
|
||||||
app.use(i18nPlugin,{ i18nScope }) // 重点,需要引入i18nScope
|
app.use(i18nPlugin,{ i18nScope }) // 重点,需要引入i18nScope
|
||||||
app.mount('#app')
|
app.mount('#app')
|
||||||
```
|
```
|
||||||
`@voerkai18n/vue`插件安装后,提供了一个`i18n`实例,可以在组件中进行`inject`。就可以按如下方式使用:
|
`@voerkai18n/vue`插件安装后,提供了一个`i18n`实例,可以在组件中进行`inject`。就可以按如下方式使用:
|
||||||
|
|
||||||
```vue
|
```javascript | pure
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
inject: ['i18n'] // 此值由`@voerkai18n/vue`插件提供
|
inject: ['i18n'] // 此值由`@voerkai18n/vue`插件提供
|
||||||
|
@ -55,12 +55,12 @@ const { toNumber,isFunction } = require("../utils")
|
|||||||
* @param {*} value
|
* @param {*} value
|
||||||
* @param {String} escapeValue
|
* @param {String} escapeValue
|
||||||
* @paran {String} next 下一步行为,取值true/false,break,skip,默认是break
|
* @paran {String} next 下一步行为,取值true/false,break,skip,默认是break
|
||||||
* @param {*} options
|
* @param {*} config
|
||||||
*/
|
*/
|
||||||
function empty(value,escapeValue,next,options) {
|
function empty(value,escapeValue,next,config) {
|
||||||
if(next===false) next = 'break'
|
if(next===false) next = 'break'
|
||||||
if(next===true) next = 'skip'
|
if(next===true) next = 'skip'
|
||||||
let opts = Object.assign({escape:"",next:'break',values:[]},options.empty || {})
|
let opts = Object.assign({escape:"",next:'break',values:[]},config.empty || {})
|
||||||
if(escapeValue!=undefined) opts.escape = escapeValue
|
if(escapeValue!=undefined) opts.escape = escapeValue
|
||||||
let emptyValues = [undefined,null]
|
let emptyValues = [undefined,null]
|
||||||
if(Array.isArray(opts.values)) emptyValues.push(...opts.values)
|
if(Array.isArray(opts.values)) emptyValues.push(...opts.values)
|
||||||
@ -86,15 +86,15 @@ empty.paramCount = 2
|
|||||||
* @param {*} value
|
* @param {*} value
|
||||||
* @param {*} escapeValue
|
* @param {*} escapeValue
|
||||||
* @param {*} next 下一步的行为,取值,break,ignore
|
* @param {*} next 下一步的行为,取值,break,ignore
|
||||||
* @param {*} options 格式化器的全局配置参数
|
* @param {*} config 格式化器的全局配置参数
|
||||||
* @returns
|
* @returns
|
||||||
*/
|
*/
|
||||||
function error(value,escapeValue,next,options) {
|
function error(value,escapeValue,next,config) {
|
||||||
if(value instanceof Error){
|
if(value instanceof Error){
|
||||||
if(scope.debug) console.error(`Error while execute formatter<${value.formatter}>:`,e)
|
if(scope.debug) console.error(`Error while execute formatter<${value.formatter}>:`,e)
|
||||||
const scope = this
|
const scope = this
|
||||||
try{
|
try{
|
||||||
let opts = Object.assign({escape:null,next:'break'},options.error || {})
|
let opts = Object.assign({escape:null,next:'break'},config.error || {})
|
||||||
if(escapeValue!=undefined) opts.escape = escapeValue
|
if(escapeValue!=undefined) opts.escape = escapeValue
|
||||||
if(next!=undefined) opts.next = next
|
if(next!=undefined) opts.next = next
|
||||||
return {
|
return {
|
||||||
|
@ -7,7 +7,7 @@
|
|||||||
|
|
||||||
// 日期格式化器
|
// 日期格式化器
|
||||||
// format取字符串"long","short","local","iso","gmt","utc"或者日期模块字符串
|
// format取字符串"long","short","local","iso","gmt","utc"或者日期模块字符串
|
||||||
// { value | date } == '2022/8/15'
|
// { value | date } == '2022/8/15' 默认
|
||||||
// { value | date('long') } == '2022/8/15 12:08:32'
|
// { value | date('long') } == '2022/8/15 12:08:32'
|
||||||
// { value | date('short') } == '8/15'
|
// { value | date('short') } == '8/15'
|
||||||
// { value | date('GMT') } == 'Mon, 15 Aug 2022 06:39:38 GMT'
|
// { value | date('GMT') } == 'Mon, 15 Aug 2022 06:39:38 GMT'
|
||||||
@ -15,6 +15,7 @@
|
|||||||
// { value | date('YYYY-MM-DD HH:mm:ss') } == '2022-8-15 12:08:32'
|
// { value | date('YYYY-MM-DD HH:mm:ss') } == '2022-8-15 12:08:32'
|
||||||
const dateFormatter = Formatter((value,format,$config)=>{
|
const dateFormatter = Formatter((value,format,$config)=>{
|
||||||
const optionals = ["long","short","local","iso","gmt","utc"]
|
const optionals = ["long","short","local","iso","gmt","utc"]
|
||||||
|
// 处理参数:支持大小写和数字0-long,1-short,2-local,3-iso,4-gmt,5-utc
|
||||||
const optionIndex = optionals.findIndex((v,i)=>{
|
const optionIndex = optionals.findIndex((v,i)=>{
|
||||||
if(typeof(format)=="string"){
|
if(typeof(format)=="string"){
|
||||||
return v==format || v== format.toUpperCase()
|
return v==format || v== format.toUpperCase()
|
||||||
@ -132,7 +133,7 @@ module.exports = {
|
|||||||
date :{
|
date :{
|
||||||
long : 'YYYY/MM/DD HH:mm:ss',
|
long : 'YYYY/MM/DD HH:mm:ss',
|
||||||
short : "MM/DD",
|
short : "MM/DD",
|
||||||
format : "local"
|
format : "long"
|
||||||
},
|
},
|
||||||
quarter : {
|
quarter : {
|
||||||
names : ["Q1","Q2","Q3","Q4"],
|
names : ["Q1","Q2","Q3","Q4"],
|
||||||
@ -183,7 +184,8 @@ module.exports = {
|
|||||||
},
|
},
|
||||||
// 默认数据类型的格式化器
|
// 默认数据类型的格式化器
|
||||||
$types: {
|
$types: {
|
||||||
Date : value => { const d = toDate(value); return `${d.getFullYear()}/${d.getMonth() + 1}/${d.getDate()} ${d.getHours()}:${d.getMinutes()}:${d.getSeconds()}` },
|
Date : dateFormatter,
|
||||||
|
//value => { const d = toDate(value); return `${d.getFullYear()}/${d.getMonth() + 1}/${d.getDate()} ${d.getHours()}:${d.getMinutes()}:${d.getSeconds()}` },
|
||||||
Null : value =>"",
|
Null : value =>"",
|
||||||
Undefined: value =>"",
|
Undefined: value =>"",
|
||||||
Error : value => "ERROR",
|
Error : value => "ERROR",
|
||||||
|
@ -14,7 +14,7 @@ module.exports = {
|
|||||||
date :{
|
date :{
|
||||||
long : 'YYYY年MM月DD日 HH点mm分ss秒',
|
long : 'YYYY年MM月DD日 HH点mm分ss秒',
|
||||||
short : "MM/DD",
|
short : "MM/DD",
|
||||||
format : 'YYYY年MM月DD日 HH点mm分ss秒'
|
format : 'long'
|
||||||
},
|
},
|
||||||
quarter : {
|
quarter : {
|
||||||
names : ["一季度","二季度","三季度","四季度"],
|
names : ["一季度","二季度","三季度","四季度"],
|
||||||
@ -50,12 +50,10 @@ module.exports = {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
$types: {
|
$types: {
|
||||||
Date: value => {const d = toDate(value);return `${d.getFullYear()}年${d.getMonth() + 1}月${d.getDate()}日 ${d.getHours()}点${d.getMinutes()}分${d.getSeconds()}秒`},
|
|
||||||
Boolean : value =>value ? "是":"否"
|
Boolean : value =>value ? "是":"否"
|
||||||
|
|
||||||
},
|
},
|
||||||
// 中文货币,big=true代表大写形式
|
// 中文货币,big=true代表大写形式
|
||||||
capitalizeCurrency:(value,big,unit="元",prefix,suffix)=>toChineseCurrency(value,{big,prefix,suffix,unit}),
|
rmb : (value,big,unit="元",prefix,suffix)=>toChineseCurrency(value,{big,prefix,suffix,unit}),
|
||||||
// 中文数字,如一千二百三十一
|
// 中文数字,如一千二百三十一
|
||||||
number:(value,isBig)=>toChineseNumber(value,isBig)
|
number :(value,isBig)=>toChineseNumber(value,isBig)
|
||||||
}
|
}
|
@ -1,4 +1,4 @@
|
|||||||
const {createFormatter,getDataTypeName,isNumber,isPlainObject,deepMerge,isFunction,isNothing,deepMixin,replaceAll} = require("./utils")
|
const {createFormatter,Formatter,getDataTypeName,isNumber,isPlainObject,deepMerge,isFunction,isNothing,deepMixin,replaceAll} = require("./utils")
|
||||||
const EventEmitter = require("./eventemitter")
|
const EventEmitter = require("./eventemitter")
|
||||||
const inlineFormatters = require("./formatters")
|
const inlineFormatters = require("./formatters")
|
||||||
const i18nScope = require("./scope")
|
const i18nScope = require("./scope")
|
||||||
@ -153,7 +153,7 @@ function forEachInterpolatedVars(str,callback,options={}){
|
|||||||
if(opts.replaceAll){ // 在某此版本上可能没有
|
if(opts.replaceAll){ // 在某此版本上可能没有
|
||||||
result=result.replaceAll(match[0],finalValue)
|
result=result.replaceAll(match[0],finalValue)
|
||||||
}else{
|
}else{
|
||||||
result=replaceAll(result,match[0],finalValue)
|
result=result.replace(match[0],finalValue)
|
||||||
}
|
}
|
||||||
}catch{// callback函数可能会抛出异常,如果抛出异常,则中断匹配过程
|
}catch{// callback函数可能会抛出异常,如果抛出异常,则中断匹配过程
|
||||||
break
|
break
|
||||||
@ -229,23 +229,18 @@ function getDataTypeDefaultFormatter(scope,activeLanguage,dataType){
|
|||||||
}else{// 当语言切换时清空缓存
|
}else{// 当语言切换时清空缓存
|
||||||
resetScopeCache(scope,activeLanguage)
|
resetScopeCache(scope,activeLanguage)
|
||||||
}
|
}
|
||||||
|
const fallbackLanguage = scope.getLanguage(activeLanguage).fallback;
|
||||||
// 先在当前作用域中查找,再在全局查找
|
// 先在当前作用域中查找,再在全局查找
|
||||||
const targets = [scope.formatters,scope.global.formatters]
|
const targets = [
|
||||||
|
scope.activeFormatters,
|
||||||
|
scope.formatters[fallbackLanguage], // 如果指定了回退语言时,也在该回退语言中查找
|
||||||
|
scope.global.formatters[activeLanguage],
|
||||||
|
scope.global.formatters["*"]
|
||||||
|
]
|
||||||
for(const target of targets){
|
for(const target of targets){
|
||||||
if(!target) continue
|
if(!target) continue
|
||||||
// 1. 在全局$types中查找
|
if(isPlainObject(target.$types) && isFunction(target.$types[dataType])){
|
||||||
if(("*" in target) && isPlainObject(target["*"].$types)){
|
return scope.$cache.typedFormatters[dataType] = target.$types[dataType]
|
||||||
let formatters = target["*"].$types
|
|
||||||
if(dataType in formatters && isFunction(formatters[dataType])){
|
|
||||||
return scope.$cache.typedFormatters[dataType] = formatters[dataType]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
// 2. 当前语言的$types中查找
|
|
||||||
if((activeLanguage in target) && isPlainObject(target[activeLanguage].$types)){
|
|
||||||
let formatters = target[activeLanguage].$types
|
|
||||||
if(dataType in formatters && isFunction(formatters[dataType])){
|
|
||||||
return scope.$cache.typedFormatters[dataType] = formatters[dataType]
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -285,7 +280,16 @@ function getFormatter(scope,activeLanguage,name){
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
/**
|
||||||
|
* Checker是一种特殊的格式化器,会在特定的时间执行
|
||||||
|
*
|
||||||
|
* Checker应该返回{value,next}用来决定如何执行下一个格式化器函数
|
||||||
|
*
|
||||||
|
*
|
||||||
|
* @param {*} checker
|
||||||
|
* @param {*} value
|
||||||
|
* @returns
|
||||||
|
*/
|
||||||
function executeChecker(checker,value){
|
function executeChecker(checker,value){
|
||||||
let result ={ value, next:"skip"}
|
let result ={ value, next:"skip"}
|
||||||
if(!isFunction(checker)) return result
|
if(!isFunction(checker)) return result
|
||||||
@ -341,7 +345,7 @@ function executeFormatter(value,formatters,scope,template){
|
|||||||
// 3. 分别执行格式化器函数
|
// 3. 分别执行格式化器函数
|
||||||
for(let formatter of formatters){
|
for(let formatter of formatters){
|
||||||
try{
|
try{
|
||||||
result = formatter(result)
|
result = formatter(result,scope.activeFormatterConfig)
|
||||||
}catch(e){
|
}catch(e){
|
||||||
e.formatter = formatter.$name
|
e.formatter = formatter.$name
|
||||||
if(scope.debug) console.error(`Error while execute i18n formatter<${formatter.$name}> for ${template}: ${e.message} ` )
|
if(scope.debug) console.error(`Error while execute i18n formatter<${formatter.$name}> for ${template}: ${e.message} ` )
|
||||||
@ -361,6 +365,9 @@ function executeFormatter(value,formatters,scope,template){
|
|||||||
|
|
||||||
/**
|
/**
|
||||||
* 添加默认的empty和error格式化器,用来提供默认的空值和错误处理逻辑
|
* 添加默认的empty和error格式化器,用来提供默认的空值和错误处理逻辑
|
||||||
|
*
|
||||||
|
* empty和error格式化器有且只能有一个,其他无效
|
||||||
|
*
|
||||||
* @param {*} formatters
|
* @param {*} formatters
|
||||||
*/
|
*/
|
||||||
function addDefaultFormatters(formatters){
|
function addDefaultFormatters(formatters){
|
||||||
@ -376,8 +383,13 @@ function addDefaultFormatters(formatters){
|
|||||||
|
|
||||||
/**
|
/**
|
||||||
*
|
*
|
||||||
* 将[[格式化器名称,[参数,参数,...]],[格式化器名称,[参数,参数,...]]]格式化器包装转化为
|
* 经parseFormatters解析t('{}')中的插值表达式中的格式化器后会得到
|
||||||
* 格式化器的调用函数链
|
* [[<格式化器名称>,[参数,参数,...]],[<格式化器名称>,[参数,参数,...]]]数组
|
||||||
|
*
|
||||||
|
* 本函数将之传换为转化为调用函数链,形式如下:
|
||||||
|
* [(v)=>{...},(v)=>{...},(v)=>{...}]
|
||||||
|
*
|
||||||
|
* 并且会自动将当前激活语言的格式化器配置作为最后一个参数配置传入,这样格式化器函数就可以读取
|
||||||
*
|
*
|
||||||
* @param {*} scope
|
* @param {*} scope
|
||||||
* @param {*} activeLanguage
|
* @param {*} activeLanguage
|
||||||
@ -387,31 +399,23 @@ function addDefaultFormatters(formatters){
|
|||||||
*/
|
*/
|
||||||
function wrapperFormatters(scope,activeLanguage,formatters){
|
function wrapperFormatters(scope,activeLanguage,formatters){
|
||||||
let wrappedFormatters = []
|
let wrappedFormatters = []
|
||||||
|
addDefaultFormatters(formatters)
|
||||||
for(let [name,args] of formatters){
|
for(let [name,args] of formatters){
|
||||||
if(name){
|
if(name){
|
||||||
const func = getFormatter(scope,activeLanguage,name)
|
let fn = getFormatter(scope,activeLanguage,name)
|
||||||
if(isFunction(func)){
|
// 格式化器无效或者没有定义时,查看当前值是否具有同名的原型方法,如果有则执行调用
|
||||||
const fn = (value) => {
|
// 比如padStart格式化器是String的原型方法,不需要配置就可以直接作为格式化器调用
|
||||||
if(func.configurable){ // 如果格式化器函数是使用createFormatter创建的
|
if(!isFunction(fn)){
|
||||||
return func.call(scope,value,...args,scope.activeFormatterConfig)
|
fn = (value,...args) =>{
|
||||||
}else{ // 不可配置的格式化器不会传入格式化器配置
|
if(isFunction(value[name])){
|
||||||
return func.call(scope,value,...args)
|
return value[name](...args)
|
||||||
|
}else{
|
||||||
|
return value
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
fn.$name = name
|
fn.$name = name
|
||||||
wrappedFormatters.push(fn)
|
wrappedFormatters.push(fn)
|
||||||
}else{
|
|
||||||
// 格式化器无效或者没有定义时,查看当前值是否具有同名的原型方法,如果有则执行调用
|
|
||||||
// 比如padStart格式化器是String的原型方法,不需要配置就可以直接作为格式化器调用
|
|
||||||
wrappedFormatters.push((value)=>{
|
|
||||||
if(isFunction(value[name])){
|
|
||||||
// 最后一个参数是当前作用域的格式化器配置参数
|
|
||||||
return value[name](value,...args)
|
|
||||||
}else{
|
|
||||||
return value
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return wrappedFormatters
|
return wrappedFormatters
|
||||||
@ -426,10 +430,11 @@ function wrapperFormatters(scope,activeLanguage,formatters){
|
|||||||
* @returns
|
* @returns
|
||||||
*/
|
*/
|
||||||
function getFormattedValue(scope,activeLanguage,formatters,value,template){
|
function getFormattedValue(scope,activeLanguage,formatters,value,template){
|
||||||
// 1. 取得格式化器函数列表
|
// 1. 取得格式化器函数列表,然后经过包装以传入当前格式化器的配置参数
|
||||||
const formatterFuncs = wrapperFormatters(scope,activeLanguage,formatters)
|
const formatterFuncs = wrapperFormatters(scope,activeLanguage,formatters)
|
||||||
// 3. 执行格式化器
|
// 3. 执行格式化器
|
||||||
if(formatterFuncs.length==0){
|
// EMPTY和ERROR是默认两个格式化器,如果只有两个则说明在t(...)中没有指定格式化器
|
||||||
|
if(formatterFuncs.length==2){
|
||||||
// 当没有格式化器时,查询是否指定了默认数据类型的格式化器,如果有则执行
|
// 当没有格式化器时,查询是否指定了默认数据类型的格式化器,如果有则执行
|
||||||
const defaultFormatter = getDataTypeDefaultFormatter(scope,activeLanguage,getDataTypeName(value))
|
const defaultFormatter = getDataTypeDefaultFormatter(scope,activeLanguage,getDataTypeName(value))
|
||||||
if(defaultFormatter){
|
if(defaultFormatter){
|
||||||
@ -661,14 +666,13 @@ function translate(message) {
|
|||||||
/**
|
/**
|
||||||
* 切换语言
|
* 切换语言
|
||||||
*/
|
*/
|
||||||
async change(value){
|
async change(language){
|
||||||
value=value.trim()
|
if(this.languages.findIndex(lang=>lang.name === language)!==-1 || isFunction(this._defaultMessageLoader)){
|
||||||
if(this.languages.findIndex(lang=>lang.name === value)!==-1 || isFunction(this._defaultMessageLoader)){
|
await this._refreshScopes(language) // 通知所有作用域刷新到对应的语言包
|
||||||
await this._refreshScopes(value) // 通知所有作用域刷新到对应的语言包
|
this._settings.activeLanguage = language
|
||||||
this._settings.activeLanguage = value
|
await this.emit(language) // 触发语言切换事件
|
||||||
await this.emit(value) // 触发语言切换事件
|
|
||||||
}else{
|
}else{
|
||||||
throw new Error("Not supported language:"+value)
|
throw new Error("Not supported language:"+language)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
@ -764,6 +768,7 @@ module.exports ={
|
|||||||
translate,
|
translate,
|
||||||
i18nScope,
|
i18nScope,
|
||||||
createFormatter,
|
createFormatter,
|
||||||
|
Formatter,
|
||||||
defaultLanguageSettings,
|
defaultLanguageSettings,
|
||||||
getDataTypeName,
|
getDataTypeName,
|
||||||
isNumber,
|
isNumber,
|
||||||
|
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@voerkai18n/runtime",
|
"name": "@voerkai18n/runtime",
|
||||||
"version": "1.0.28",
|
"version": "1.0.29",
|
||||||
"description": "核心运行时",
|
"description": "核心运行时",
|
||||||
"main": "./dist/index.cjs",
|
"main": "./dist/index.cjs",
|
||||||
"module": "dist/index.esm.js",
|
"module": "dist/index.esm.js",
|
||||||
@ -35,5 +35,5 @@
|
|||||||
"rollup-plugin-terser": "^7.0.2",
|
"rollup-plugin-terser": "^7.0.2",
|
||||||
"@voerkai18n/autopublish": "workspace:^1.0.2"
|
"@voerkai18n/autopublish": "workspace:^1.0.2"
|
||||||
},
|
},
|
||||||
"lastPublish": "2022-08-07T19:16:27+08:00"
|
"lastPublish": "2022-08-16T09:47:13+08:00"
|
||||||
}
|
}
|
@ -39,12 +39,14 @@ export default [
|
|||||||
{
|
{
|
||||||
file: 'dist/runtime.cjs',
|
file: 'dist/runtime.cjs',
|
||||||
exports:"auto",
|
exports:"auto",
|
||||||
format:"cjs"
|
format:"cjs",
|
||||||
|
sourcemap:true
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
file: 'dist/runtime.mjs',
|
file: 'dist/runtime.mjs',
|
||||||
exports:"default",
|
exports:"default",
|
||||||
format:"esm"
|
format:"esm",
|
||||||
|
sourcemap:true
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
plugins:[
|
plugins:[
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
const { isPlainObject, isFunction, getByPath, deepMixin } = require("./utils");
|
const { isPlainObject, isFunction, getByPath, deepMixin,deepClone } = require("./utils");
|
||||||
|
|
||||||
const DataTypes = [
|
const DataTypes = [
|
||||||
"String",
|
"String",
|
||||||
@ -41,8 +41,8 @@ module.exports = class i18nScope {
|
|||||||
const { I18nManager } = require("./");
|
const { I18nManager } = require("./");
|
||||||
globalThis.VoerkaI18n = new I18nManager({
|
globalThis.VoerkaI18n = new I18nManager({
|
||||||
debug : this._debug,
|
debug : this._debug,
|
||||||
defaultLanguage: this.defaultLanguage,
|
defaultLanguage: this._defaultLanguage,
|
||||||
activeLanguage : this.activeLanguage,
|
activeLanguage : this._activeLanguage,
|
||||||
languages : options.languages,
|
languages : options.languages,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@ -55,7 +55,7 @@ module.exports = class i18nScope {
|
|||||||
get id() {return this._id;} // 作用域唯一id
|
get id() {return this._id;} // 作用域唯一id
|
||||||
get debug() {return this._debug;} // 调试开关
|
get debug() {return this._debug;} // 调试开关
|
||||||
get defaultLanguage() {return this._defaultLanguage;} // 默认语言名称
|
get defaultLanguage() {return this._defaultLanguage;} // 默认语言名称
|
||||||
get activeLanguage() {return this._activeLanguage;} // 默认语言名称
|
get activeLanguage() {return this._global.activeLanguage;} // 默认语言名称
|
||||||
get default() {return this._default;} // 默认语言包
|
get default() {return this._default;} // 默认语言包
|
||||||
get messages() {return this._messages; } // 当前语言包
|
get messages() {return this._messages; } // 当前语言包
|
||||||
get idMap() {return this._idMap;} // 消息id映射列表
|
get idMap() {return this._idMap;} // 消息id映射列表
|
||||||
@ -159,7 +159,7 @@ module.exports = class i18nScope {
|
|||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
* 初始化格式化器
|
* 初始化格式化器
|
||||||
* 激活和默认语言的格式化器采用静态导入的形式,而没有采用异步块的形式,这是为了确保首次加载时的能马上读取,而减少延迟加载
|
* 激活和默认语言的格式化器采用静态导入的形式,而没有采用异步块的形式,这是为了确保首次加载时的能马上读取,而不能采用延迟加载方式
|
||||||
* _activeFormatters={$config:{...},$types:{...},[格式化器名称]:()=>{...},[格式化器名称]:()=>{...},...}}
|
* _activeFormatters={$config:{...},$types:{...},[格式化器名称]:()=>{...},[格式化器名称]:()=>{...},...}}
|
||||||
*/
|
*/
|
||||||
_initFormatters(newLanguage){
|
_initFormatters(newLanguage){
|
||||||
@ -170,7 +170,7 @@ module.exports = class i18nScope {
|
|||||||
} else {
|
} else {
|
||||||
if (this._debug) console.warn(`Not initialize <${newLanguage}> formatters.`);
|
if (this._debug) console.warn(`Not initialize <${newLanguage}> formatters.`);
|
||||||
}
|
}
|
||||||
this._generateFormatterOptions(newLanguage)
|
this._generateFormatterConfig(newLanguage)
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
if (this._debug) console.error(`Error while initialize ${newLanguage} formatters: ${e.message}`);
|
if (this._debug) console.error(`Error while initialize ${newLanguage} formatters: ${e.message}`);
|
||||||
}
|
}
|
||||||
@ -183,7 +183,7 @@ module.exports = class i18nScope {
|
|||||||
* 当切换语言时,格式化器应该切换到对应语言的格式化器
|
* 当切换语言时,格式化器应该切换到对应语言的格式化器
|
||||||
*
|
*
|
||||||
* 重要需要处理:
|
* 重要需要处理:
|
||||||
* $config参数采用合并继承机制
|
* $config参数采用合并继承机制,从全局读取
|
||||||
*
|
*
|
||||||
*
|
*
|
||||||
* @param {*} language
|
* @param {*} language
|
||||||
@ -198,7 +198,7 @@ module.exports = class i18nScope {
|
|||||||
this._activeFormatters = (await loader()).default;
|
this._activeFormatters = (await loader()).default;
|
||||||
}
|
}
|
||||||
// 合并生成格式化器的配置参数,当执行格式化器时该参数将被传递给格式化器
|
// 合并生成格式化器的配置参数,当执行格式化器时该参数将被传递给格式化器
|
||||||
this._generateFormatterOptions(newLanguage)
|
this._generateFormatterConfig(newLanguage)
|
||||||
} else {
|
} else {
|
||||||
if (this._debug) console.warn(`Not configured <${newLanguage}> formatters.`);
|
if (this._debug) console.warn(`Not configured <${newLanguage}> formatters.`);
|
||||||
}
|
}
|
||||||
@ -212,10 +212,10 @@ module.exports = class i18nScope {
|
|||||||
* - global.formatters[language].$config
|
* - global.formatters[language].$config
|
||||||
* - scope.activeFormatters.$config 当前优先
|
* - scope.activeFormatters.$config 当前优先
|
||||||
*/
|
*/
|
||||||
_generateFormatterOptions(language){
|
_generateFormatterConfig(language){
|
||||||
let options
|
let options
|
||||||
try{
|
try{
|
||||||
options = Object.assign({},getByPath(this._global.formatters,`*.$config`,{}))
|
options = deepClone(getByPath(this._global.formatters,`*.$config`,{}))
|
||||||
deepMixin(options,getByPath(this._global.formatters,`${language}.$config`,{}))
|
deepMixin(options,getByPath(this._global.formatters,`${language}.$config`,{}))
|
||||||
deepMixin(options,getByPath(this._activeFormatters,"$config",{}))
|
deepMixin(options,getByPath(this._activeFormatters,"$config",{}))
|
||||||
}catch(e){
|
}catch(e){
|
||||||
@ -235,38 +235,45 @@ module.exports = class i18nScope {
|
|||||||
if (newLanguage === this.defaultLanguage) {
|
if (newLanguage === this.defaultLanguage) {
|
||||||
this._messages = this._default;
|
this._messages = this._default;
|
||||||
await this._patch(this._messages, newLanguage); // 异步补丁
|
await this._patch(this._messages, newLanguage); // 异步补丁
|
||||||
this._changeFormatters(newLanguage);
|
await this._changeFormatters(newLanguage);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
// 非默认语言需要异步加载语言包文件,加载器是一个异步函数
|
// 非默认语言需要异步加载语言包文件,加载器是一个异步函数
|
||||||
// 如果没有加载器,则无法加载语言包,因此回退到默认语言
|
// 如果没有加载器,则无法加载语言包,因此回退到默认语言
|
||||||
let loader = this.loaders[newLanguage];
|
let loader = this.loaders[newLanguage];
|
||||||
try {
|
try {
|
||||||
if (isPlainObject(loader)) {
|
let newMessages, useRemote =false;
|
||||||
this._messages = loader;
|
if (isPlainObject(loader)) { // 静态语言包
|
||||||
await this._patch(this._messages, newLanguage);
|
newMessages = loader;
|
||||||
} else if (isFunction(loader)) {
|
} else if (isFunction(loader)) { // 语言包异步chunk
|
||||||
this._messages = (await loader()).default;
|
newMessages = (await loader()).default;
|
||||||
|
} else if (isFunction(this.global.defaultMessageLoader)) { // 从远程加载语言包:如果该语言没有指定加载器,则使用全局配置的默认加载器
|
||||||
|
const loadedMessages = await this.global.loadMessagesFromDefaultLoader(newLanguage,this);
|
||||||
|
if(isPlainObject(loadedMessages)){
|
||||||
|
useRemote = true
|
||||||
|
// 需要保存动态语言包中的$config,合并到对应语言的格式化器配置
|
||||||
|
if(isPlainObject(loadedMessages.$config)){
|
||||||
|
this._formatters[newLanguage] = {
|
||||||
|
$config : loadedMessages.$config
|
||||||
|
}
|
||||||
|
delete loadedMessages.$config
|
||||||
|
}
|
||||||
|
newMessages = Object.assign({},this._default,loadedMessages);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if(newMessages){
|
||||||
|
this._messages = newMessages
|
||||||
this._activeLanguage = newLanguage;
|
this._activeLanguage = newLanguage;
|
||||||
|
// 打语言包补丁, 如果是从远程加载语言包则不需要再打补丁了
|
||||||
|
if(!useRemote) {
|
||||||
await this._patch(this._messages, newLanguage);
|
await this._patch(this._messages, newLanguage);
|
||||||
} else if (isFunction(this.global.defaultMessageLoader)) {
|
}
|
||||||
// 如果该语言没有指定加载器,则使用全局配置的默认加载器
|
// 切换到对应语言的格式化器
|
||||||
const loadedMessages =
|
await this._changeFormatters(newLanguage);
|
||||||
await this.global.loadMessagesFromDefaultLoader(
|
}else{
|
||||||
newLanguage,
|
|
||||||
this
|
|
||||||
);
|
|
||||||
this._messages = Object.assign(
|
|
||||||
{},
|
|
||||||
this._default,
|
|
||||||
loadedMessages
|
|
||||||
);
|
|
||||||
this._activeLanguage = newLanguage;
|
|
||||||
} else {
|
|
||||||
this._fallback();
|
this._fallback();
|
||||||
}
|
}
|
||||||
// 应该切换到对应语言的格式化器
|
|
||||||
this._changeFormatters(newLanguage);
|
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
if (this._debug) console.warn(`Error while loading language <${newLanguage}> on i18nScope(${this.id}): ${e.message}`);
|
if (this._debug) console.warn(`Error while loading language <${newLanguage}> on i18nScope(${this.id}): ${e.message}`);
|
||||||
this._fallback();
|
this._fallback();
|
||||||
@ -344,16 +351,10 @@ module.exports = class i18nScope {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
// 以下方法引用全局VoerkaI18n实例的方法
|
// 以下方法引用全局VoerkaI18n实例的方法
|
||||||
get on() {
|
on() {return this._global.on(...arguments); }
|
||||||
return this._global.on.bind(this._global);
|
off() {return this._global.off(...arguments); }
|
||||||
}
|
offAll() {return this._global.offAll(...arguments);}
|
||||||
get off() {
|
async change(language) {
|
||||||
return this._global.off.bind(this._global);
|
await this._global.change(language);
|
||||||
}
|
|
||||||
get offAll() {
|
|
||||||
return this._global.offAll.bind(this._global);
|
|
||||||
}
|
|
||||||
get change() {
|
|
||||||
return this._global.change.bind(this._global);
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
@ -97,7 +97,6 @@ function deepMerge(toObj,formObj,options={}){
|
|||||||
return results
|
return results
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
function deepMixin(toObj,formObj,options={}){
|
function deepMixin(toObj,formObj,options={}){
|
||||||
return deepMerge(toObj,formObj,{...options,mixin:true})
|
return deepMerge(toObj,formObj,{...options,mixin:true})
|
||||||
}
|
}
|
||||||
@ -174,7 +173,7 @@ function toNumber(value,defualt=0) {
|
|||||||
|
|
||||||
/**
|
/**
|
||||||
* 根据路径获取指定值
|
* 根据路径获取指定值
|
||||||
*
|
* 只支持简单的.分割路径
|
||||||
* getByPath({a:{b:1}},"a.b") == 1
|
* getByPath({a:{b:1}},"a.b") == 1
|
||||||
* getByPath({a:{b:1}},"a.c",2) == 2
|
* getByPath({a:{b:1}},"a.c",2) == 2
|
||||||
*
|
*
|
||||||
@ -184,11 +183,11 @@ function toNumber(value,defualt=0) {
|
|||||||
* @returns
|
* @returns
|
||||||
*/
|
*/
|
||||||
function getByPath(obj,path,defaultValue){
|
function getByPath(obj,path,defaultValue){
|
||||||
if(typeof(obj)!="object") return defaultValue
|
if(typeof(obj)!="object" || typeof(path)!="string") return defaultValue
|
||||||
let paths = path.split(".")
|
let paths = path.split(".")
|
||||||
let cur = obj
|
let cur = obj
|
||||||
for(let key of paths){
|
for(let key of paths){
|
||||||
if(typeof(cur)=="object" && key in cur ){
|
if(typeof(cur)=="object" && (key in cur) ){
|
||||||
cur = cur[key]
|
cur = cur[key]
|
||||||
}else{
|
}else{
|
||||||
return defaultValue
|
return defaultValue
|
||||||
@ -196,6 +195,22 @@ function getByPath(obj,path,defaultValue){
|
|||||||
}
|
}
|
||||||
return cur
|
return cur
|
||||||
}
|
}
|
||||||
|
function deepClone(obj){
|
||||||
|
if(obj==undefined) return obj
|
||||||
|
if (['string',"number","boolean","function","undefined"].includes(typeof(obj))){
|
||||||
|
return obj
|
||||||
|
}else if(Array.isArray(obj)){
|
||||||
|
return obj.map(item => deepClone(item))
|
||||||
|
}else if(typeof(obj)=="object"){
|
||||||
|
let results = {}
|
||||||
|
Object.entries(obj).forEach(([key,value])=>{
|
||||||
|
results[key] = deepClone(value)
|
||||||
|
})
|
||||||
|
return results
|
||||||
|
}else{
|
||||||
|
return obj
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
// YY 18 年,两位数
|
// YY 18 年,两位数
|
||||||
@ -226,8 +241,7 @@ function formatDatetime(value,templ="YYYY/MM/DD HH:mm:ss"){
|
|||||||
const v = toDate(value)
|
const v = toDate(value)
|
||||||
const year =String(v.getFullYear()),month = String(v.getMonth()+1),weekday=String(v.getDay()),day=String(v.getDate())
|
const year =String(v.getFullYear()),month = String(v.getMonth()+1),weekday=String(v.getDay()),day=String(v.getDate())
|
||||||
const hourNum = v.getHours()
|
const hourNum = v.getHours()
|
||||||
const hour = String(hourNum).minute = String(v.getMinutes()),second = String(v.getSeconds()),millisecond=String(v.getMilliseconds())
|
const hour = String(hourNum), minute = String(v.getMinutes()),second = String(v.getSeconds()),millisecond=String(v.getMilliseconds())
|
||||||
const timezone = v.getTimezoneOffset()
|
|
||||||
const vars = [
|
const vars = [
|
||||||
["YYYY", year], // 2018 年,四位数
|
["YYYY", year], // 2018 年,四位数
|
||||||
["YY", year.substring(year.length - 2, year.length)], // 18 年,两位数
|
["YY", year.substring(year.length - 2, year.length)], // 18 年,两位数
|
||||||
@ -250,14 +264,15 @@ function formatDatetime(value,templ="YYYY/MM/DD HH:mm:ss"){
|
|||||||
["A", hour > 12 ? "PM" : "AM"], // AM / PM 上/下午,大写
|
["A", hour > 12 ? "PM" : "AM"], // AM / PM 上/下午,大写
|
||||||
["a", hour > 12 ? "pm" : "am"], // am / pm 上/下午,小写
|
["a", hour > 12 ? "pm" : "am"], // am / pm 上/下午,小写
|
||||||
]
|
]
|
||||||
vars.forEach(([key,value])=>result = replaceAll(result,key,value))
|
let result = templ
|
||||||
|
vars.forEach(([k,v])=>result = replaceAll(result,k,v))
|
||||||
return result
|
return result
|
||||||
}
|
}
|
||||||
|
|
||||||
function formatTime(value,templ="HH:mm:ss"){
|
function formatTime(value,templ="HH:mm:ss"){
|
||||||
const v = toDate(value)
|
const v = toDate(value)
|
||||||
const hourNum = v.getHours()
|
const hourNum = v.getHours()
|
||||||
const hour = String(hourNum).minute = String(v.getMinutes()),second = String(v.getSeconds()),millisecond=String(v.getMilliseconds())
|
const hour = String(hourNum),minute = String(v.getMinutes()),second = String(v.getSeconds()),millisecond=String(v.getMilliseconds())
|
||||||
let result = templ
|
let result = templ
|
||||||
const vars = [
|
const vars = [
|
||||||
["HH", hour.padStart(2, "0")], // 00-23 24小时,两位数
|
["HH", hour.padStart(2, "0")], // 00-23 24小时,两位数
|
||||||
@ -274,7 +289,7 @@ function formatTime(value,templ="HH:mm:ss"){
|
|||||||
["A", hour > 12 ? "PM" : "AM"], // AM / PM 上/下午,大写
|
["A", hour > 12 ? "PM" : "AM"], // AM / PM 上/下午,大写
|
||||||
["a", hour > 12 ? "pm" : "am"] // am / pm 上/下午,小写
|
["a", hour > 12 ? "pm" : "am"] // am / pm 上/下午,小写
|
||||||
]
|
]
|
||||||
vars.forEach(([key,value])=>result = replaceAll(result,key,value))
|
vars.forEach(([k,v])=>result = replaceAll(result,k,v))
|
||||||
return result
|
return result
|
||||||
}
|
}
|
||||||
/**
|
/**
|
||||||
@ -310,6 +325,7 @@ function replaceAll(str,findValue,replaceValue){
|
|||||||
* "currency":createFormatter((value,prefix,suffix, division ,precision,options)=>{
|
* "currency":createFormatter((value,prefix,suffix, division ,precision,options)=>{
|
||||||
* // 无论在格式化入参数是多少个,经过处理后在此得到prefix,suffix, division ,precision参数已经是经过处理后的参数
|
* // 无论在格式化入参数是多少个,经过处理后在此得到prefix,suffix, division ,precision参数已经是经过处理后的参数
|
||||||
* 依次读取格式化器的参数合并:
|
* 依次读取格式化器的参数合并:
|
||||||
|
* - 创建格式化时的defaultParams参数
|
||||||
* - 从当前激活格式化器的$config中读取配置参数
|
* - 从当前激活格式化器的$config中读取配置参数
|
||||||
* - 在t函数后传入参数
|
* - 在t函数后传入参数
|
||||||
* 比如currency格式化器支持4参数,其入参顺序是prefix,suffix, division ,precision
|
* 比如currency格式化器支持4参数,其入参顺序是prefix,suffix, division ,precision
|
||||||
@ -338,19 +354,19 @@ function replaceAll(str,findValue,replaceValue){
|
|||||||
* )
|
* )
|
||||||
*
|
*
|
||||||
* @param {*} fn
|
* @param {*} fn
|
||||||
* @param {*} defaultParams 默认参数
|
* @param {*} options 配置参数
|
||||||
* @param {*} meta
|
* @param {*} defaultParams 可选默认值
|
||||||
* @returns
|
* @returns
|
||||||
*/
|
*/
|
||||||
function createFormatter(fn,defaultParams={},meta={}){
|
function createFormatter(fn,options={},defaultParams={}){
|
||||||
let opts = Object.assign({
|
let opts = Object.assign({
|
||||||
normalize : null, // 对输入值进行规范化处理,如进行时间格式化时,为了提高更好的兼容性,支持数字时间戳/字符串/Date等,需要对输入值进行处理,如强制类型转换等
|
normalize : null, // 对输入值进行规范化处理,如进行时间格式化时,为了提高更好的兼容性,支持数字时间戳/字符串/Date等,需要对输入值进行处理,如强制类型转换等
|
||||||
params : [], // 声明参数顺序
|
params : [], // 声明参数顺序
|
||||||
configKey : null // 声明该格式化器在$config中的路径,支持简单的使用.的路径语法
|
configKey : null // 声明该格式化器在$config中的路径,支持简单的使用.的路径语法
|
||||||
})
|
},options)
|
||||||
|
|
||||||
// 最后一个参数是传入activeFormatterConfig参数
|
// 最后一个参数是传入activeFormatterConfig参数
|
||||||
const wrappedFn = function(value,...args){
|
const $formatter = function(value,...args){
|
||||||
let finalValue = value
|
let finalValue = value
|
||||||
// 1. 输入值规范处理,主要是进行类型转换,确保输入的数据类型及相关格式的正确性,提高数据容错性
|
// 1. 输入值规范处理,主要是进行类型转换,确保输入的数据类型及相关格式的正确性,提高数据容错性
|
||||||
if(isFunction(opts.normalize)){
|
if(isFunction(opts.normalize)){
|
||||||
@ -369,10 +385,10 @@ function replaceAll(str,findValue,replaceValue){
|
|||||||
if(i>=args.length-1) break // 最后一参数是配置
|
if(i>=args.length-1) break // 最后一参数是配置
|
||||||
if(args[i]!==undefined) finalArgs[i] = args[i]
|
if(args[i]!==undefined) finalArgs[i] = args[i]
|
||||||
}
|
}
|
||||||
return fn(finalValue,...finalArgs,activeFormatterConfigs)
|
return fn(finalValue,...finalArgs,formatterConfig)
|
||||||
}
|
}
|
||||||
wrappedFn.configurable = true // 当函数是可配置时才在最后一个参数中传入$config
|
$formatter.configurable = true // 当函数是可配置时才在最后一个参数中传入$config
|
||||||
return wrappedFn
|
return $formatter
|
||||||
}
|
}
|
||||||
|
|
||||||
const Formatter = createFormatter
|
const Formatter = createFormatter
|
||||||
@ -382,6 +398,7 @@ module.exports ={
|
|||||||
isFunction,
|
isFunction,
|
||||||
isNumber,
|
isNumber,
|
||||||
isNothing,
|
isNothing,
|
||||||
|
deepClone,
|
||||||
deepMerge,
|
deepMerge,
|
||||||
deepMixin,
|
deepMixin,
|
||||||
Formatter,
|
Formatter,
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
const {i18nScope, translate, getInterpolatedVars } = require('../packages/runtime/index')
|
const {i18nScope, translate, getInterpolatedVars } = require('../packages/runtime/dist/runtime.cjs')
|
||||||
const dayjs = require('dayjs');
|
const dayjs = require('dayjs');
|
||||||
|
|
||||||
const loaders = {
|
const loaders = {
|
||||||
@ -31,10 +31,10 @@ const formatters = {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const idMap = {
|
const idMap = {
|
||||||
1:"你好",
|
"你好":1,
|
||||||
2:"现在是{}",
|
"现在是{}":2,
|
||||||
3:"我出生于{year}年,今年{age}岁",
|
"我出生于{year}年,今年{age}岁":3,
|
||||||
4:"我有{}个朋友"
|
"我有{}个朋友":4
|
||||||
}
|
}
|
||||||
const languages = [
|
const languages = [
|
||||||
{ name: "zh", title: "中文" },
|
{ name: "zh", title: "中文" },
|
||||||
@ -127,7 +127,7 @@ test("替换翻译内容的位置插值变量",done=>{
|
|||||||
expect(t("{ a|}{b|dd}{c|}{}",1,2,3)).toBe("123{}");
|
expect(t("{ a|}{b|dd}{c|}{}",1,2,3)).toBe("123{}");
|
||||||
// 中文状态下true和false被转换成中文的"是"和"否"
|
// 中文状态下true和false被转换成中文的"是"和"否"
|
||||||
expect(t("{}{}{}",1,"2",true)).toBe("12是");
|
expect(t("{}{}{}",1,"2",true)).toBe("12是");
|
||||||
expect(trim("{|double}{}{}",1,"2",true)).toBe("22是");
|
expect(t("{|double}{}{}",1,"2",true)).toBe("22是");
|
||||||
done()
|
done()
|
||||||
})
|
})
|
||||||
|
|
||||||
@ -141,9 +141,7 @@ test("命名插值变量使用格式化器",done=>{
|
|||||||
// 提供无效的格式化器,直接忽略
|
// 提供无效的格式化器,直接忽略
|
||||||
expect(t("{a|x}{b|x|y}{c|}",{a:1,b:2,c:3})).toBe("123");
|
expect(t("{a|x}{b|x|y}{c|}",{a:1,b:2,c:3})).toBe("123");
|
||||||
expect(t("{a|x}{b|x|y}{c|double}",{a:1,b:2,c:3})).toBe("126");
|
expect(t("{a|x}{b|x|y}{c|double}",{a:1,b:2,c:3})).toBe("126");
|
||||||
// 默认的字符串格式化器,不需要定义使用字符串方法
|
// padStart和trim格式化器只是字符串的原型方法,不需要额外定义可以直接使用
|
||||||
expect(t("{a|x}{b|x|y}{c|double}",{a:1,b:2,c:3})).toBe("126");
|
|
||||||
// padStart格式化器是字符串的方法,不需要额外定义可以直接使用
|
|
||||||
expect(t("{a|padStart(10)}",{a:"123"})).toBe(" 123");
|
expect(t("{a|padStart(10)}",{a:"123"})).toBe(" 123");
|
||||||
expect(t("{a|padStart(10)|trim}",{a:"123"})).toBe("123");
|
expect(t("{a|padStart(10)|trim}",{a:"123"})).toBe("123");
|
||||||
done()
|
done()
|
||||||
@ -163,18 +161,16 @@ test("命名插值变量使用格式化器",done=>{
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
test("切换到其他语言时的自动匹配同名格式化器",done=>{
|
test("切换到其他语言时的自动匹配同名格式化器",async ()=>{
|
||||||
// 默认的字符串类型的格式化器
|
|
||||||
expect(t("{a}",{a:true})).toBe("是");
|
expect(t("{a}",{a:true})).toBe("是");
|
||||||
expect(t("{name|book}是毛泽东思想的重要载体","毛泽东选集")).toBe("《毛泽东选集》是毛泽东思想的重要载体");
|
expect(t("{name|book}是毛泽东思想的重要载体","毛泽东选集")).toBe("《毛泽东选集》是毛泽东思想的重要载体");
|
||||||
changeLanguage("en")
|
await scope.change("en")
|
||||||
expect(t("{a}",{a:false})).toBe("False");
|
expect(t("{a}",{a:false})).toBe("False");
|
||||||
expect(t("{name|book}是毛泽东思想的重要载体","毛泽东选集")).toBe("<毛泽东选集>是毛泽东思想的重要载体");
|
expect(t("{name|book}是毛泽东思想的重要载体","毛泽东选集")).toBe("<毛泽东选集>是毛泽东思想的重要载体");
|
||||||
done()
|
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
test("位置插值翻译文本内容",done=>{
|
test("位置插值翻译文本内容",async ()=>{
|
||||||
const now = new Date()
|
const now = new Date()
|
||||||
expect(t("你好")).toBe("你好");
|
expect(t("你好")).toBe("你好");
|
||||||
expect(t("现在是{}",now)).toBe(`现在是${dayjs(now).format('YYYY年MM月DD日 HH点mm分ss秒')}`);
|
expect(t("现在是{}",now)).toBe(`现在是${dayjs(now).format('YYYY年MM月DD日 HH点mm分ss秒')}`);
|
||||||
@ -183,21 +179,20 @@ test("位置插值翻译文本内容",done=>{
|
|||||||
expect(t("1")).toBe("你好");
|
expect(t("1")).toBe("你好");
|
||||||
expect(t("2",now)).toBe(`现在是${dayjs(now).format('YYYY年MM月DD日 HH点mm分ss秒')}`);
|
expect(t("2",now)).toBe(`现在是${dayjs(now).format('YYYY年MM月DD日 HH点mm分ss秒')}`);
|
||||||
|
|
||||||
changeLanguage("en")
|
await scope.change("en")
|
||||||
|
.eixt
|
||||||
expect(t("你好")).toBe("hello");
|
expect(t("你好")).toBe("hello");
|
||||||
expect(t("现在是{}",now)).toBe(`Now is ${dayjs(now).format('YYYY-MM-DD HH:mm:ss')}`);
|
expect(t("现在是{}",now)).toBe(`Now is ${dayjs(now).format('YYYY-MM-DD HH:mm:ss')}`);
|
||||||
expect(t("1")).toBe("hello");
|
expect(t("1")).toBe("hello");
|
||||||
expect(t("2",now)).toBe(`Now is ${dayjs(now).format('YYYY-MM-DD HH:mm:ss')}`);
|
expect(t("2",now)).toBe(`Now is ${dayjs(now).format('YYYY-MM-DD HH:mm:ss')}`);
|
||||||
done()
|
|
||||||
})
|
})
|
||||||
|
|
||||||
test("命名插值翻译文本内容",done=>{
|
test("命名插值翻译文本内容",async ()=>{
|
||||||
const now = new Date()
|
const now = new Date()
|
||||||
expect(t("你好")).toBe("你好");
|
expect(t("你好")).toBe("你好");
|
||||||
expect(t("现在是{}",now)).toBe(`现在是${dayjs(now).format('YYYY年MM月DD日 HH点mm分ss秒')}`);
|
expect(t("现在是{}",now)).toBe(`现在是${dayjs(now).format('YYYY年MM月DD日 HH点mm分ss秒')}`);
|
||||||
|
|
||||||
|
await scope.change("en")
|
||||||
changeLanguage("en")
|
|
||||||
expect(t("你好")).toBe("hello");
|
expect(t("你好")).toBe("hello");
|
||||||
expect(t("现在是{}",now)).toBe(`Now is ${dayjs(now).format('YYYY-MM-DD HH:mm:ss')}`);
|
expect(t("现在是{}",now)).toBe(`Now is ${dayjs(now).format('YYYY-MM-DD HH:mm:ss')}`);
|
||||||
expect(t("1")).toBe("hello");
|
expect(t("1")).toBe("hello");
|
||||||
@ -206,24 +201,22 @@ test("命名插值翻译文本内容",done=>{
|
|||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
test("当没有对应的语言翻译时",done=>{
|
test("当没有对应的语言翻译时,保持原始输出",async ()=>{
|
||||||
expect(t("我是中国人")).toBe("我是中国人");
|
expect(t("我是中国人")).toBe("我是中国人");
|
||||||
scope.change("en")
|
await scope.change("en")
|
||||||
expect(t("我是中国人")).toBe("我是中国人");
|
expect(t("我是中国人")).toBe("我是中国人");
|
||||||
done()
|
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
test("切换到未知语言时回退到默认语言",done=>{
|
test("切换到未知语言时回退到默认语言",async ()=>{
|
||||||
expect(t("我是中国人")).toBe("我是中国人");
|
expect(t("我是中国人")).toBe("我是中国人");
|
||||||
scope.change("xn")
|
expect(async ()=>await scope.change("xn")).rejects.toThrow(Error);
|
||||||
expect(t("我是中国人")).toBe("我是中国人");
|
expect(t("我是中国人")).toBe("我是中国人");
|
||||||
done()
|
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
test("翻译复数支持",done=>{
|
test("翻译复数支持",async ()=>{
|
||||||
scope.change("en")
|
await scope.change("en")
|
||||||
expect(t("我有{}个朋友",0)).toBe("I have no friends");
|
expect(t("我有{}个朋友",0)).toBe("I have no friends");
|
||||||
expect(t("我有{}个朋友",1)).toBe("I have one friends");
|
expect(t("我有{}个朋友",1)).toBe("I have one friends");
|
||||||
expect(t("我有{}个朋友",2)).toBe("I have two friends");
|
expect(t("我有{}个朋友",2)).toBe("I have two friends");
|
||||||
|
Loading…
x
Reference in New Issue
Block a user