VoerkaI18n 3.0新特性征集

[zhangfisher]

VoerkaI18n 3.0新特性征集:

一词多译

即一个词在不同的上下文场景中需要翻译为不同的词。

交互式参数提示

现有的cli命令需要输入的参数较多，不容易记住，拟引入交互式提示功能。
通过交互提示输入各种参数，减少记忆负担。
详见Mixcli

在线编辑多语言

VoerkaI18n支持动态语言包补丁功能，也可以很容易扩展在线修改语言词条的功能，见这里

拟提供开箱即用的解决方案，让用户直接在界面上进行翻译修改。

顶层CSS语言类

由于不同语言的长度差异很大，当多语言的切换往往会导致界面布局混乱，所以增加一个特性
当切换语言时在body上自动添加data-language='<当前语言>'的属性，这样开发时就可以为不同的语言添加定制样式

实时翻译功能

目前的翻译流程需要调用extract、translate， compile，计划开发一个vite插件，在开发过程中，可以自动执行这些命令，实现完全自动的实时翻译。
此特性的加入将使得多语言体验完全自动化。

语言编码遵循ISO-639-1 规范

支持服务端SSR场景

支持NextJs的多语言

多库时Scope加载

在多库模式下加载时，scope支持不依赖于加载顺序，可以在应用scope加载后再自动注册

[xm-zzf]

安装不够便捷 可以根据安装@voerkai18n 直接在目录选择下安装 @voerkai18n/cli @voerkai18n/vue @voerkai18n/runtime 等等一系列包

[zhangfisher]

引入Mixed-cli，为命令行引入交互功能，减少用户对命令行的记忆负担，这个可以有

[FiredRice]

可否解决不同namespace下相同中文翻译冲突的问题

[zhangfisher]

不同namespace下相同中文翻译冲突，本质上就是一词多译的问题

[faiz-gear]

支持通过命令自动模块，包裹文本.如执行voerkai18n wrap命令， 会在匹配到的文件头部添加import { t } from 'language', 匹配到的文本如'中国'会转换成't('中国')'

[zhangfisher]

自动进行包裹要翻译的文本难度太大，估计实现不了。
最多只能实现一些辅助工具，减少一下工作量

[SKT1yang]

自动进行包裹要翻译的文本难度太大，估计实现不了。 最多只能实现一些辅助工具，减少一下工作量

不是难度太大，是100%会误杀，目前左右操作都是languages文件里进行，不会修改其他代码，完全没有侵入性，万一操作不好，把代码改崩了咋办，虽然可以通过git 回滚 找回，但是风险太大了

[firmianaQ]

自动按文件路径配置namespace

[firmianaQ]

请问能不能遵循 BCP47 规范，不然还得维护一套前后端语言代码对应的数据😭

[SKT1yang]

包唯一id能不能有version，加上version，也就是name+version，name兜底

[SKT1yang]

1. “多库时Scope加载支持不依赖于加载顺序，可以在应用scope加载后再自动注册”能否能实现？各个渲染框架首次渲染时机不可控的，scope就算都加载好了，但是已经ui渲染好了，是否有必要限制主scope加载时机？
2. 首次渲染和后续切换行为表现尽量简单和符合预期，比如localstorage中language的影响，scope加载顺序的影响。文档增加这部分图表式的说明，demo增加最小最佳实践和示例，统一各平台和框架差异。
3. 自动进行包裹要翻译的文本是可以实现的，就是看以什么方式实现，既能达到减少工作量的目的，又能100%防止误杀，建议有三种：1. 命令行；2. vscode插件；3. 嵌入eslint。各有优缺点，全量包裹还是部分文件或者文件夹包裹，是否自动加上import t 函数等。
4. 增加在线可视化导出导入语言包，支持json、excel等。

[zhangfisher]

3.0新版本的runtime已基本重构完成，正在重构新版本的cli以及配套的工具。

“多库时Scope加载支持不依赖于加载顺序，可以在应用scope加载后再自动注册”能否能实现？各个渲染框架首次渲染时机不可控的，scope就算都加载好了，但是已经ui渲染好了，是否有必要限制主scope加载时机？

已经支持此特性

首次渲染和后续切换行为表现尽量简单和符合预期，比如localstorage中language的影响，scope加载顺序的影响。文档增加这部分图表式的说明，demo增加最小最佳实践和示例，统一各平台和框架差异。

在新版本下会重新编写各平台的Demo，也欢迎参与贡献

自动进行包裹要翻译的文本是可以实现的，就是看以什么方式实现，既能达到减少工作量的目的，又能100%防止误杀，建议有三种：1. 命令行；2. vscode插件；3. 嵌入eslint。各有优缺点，全量包裹还是部分文件或者文件夹包裹，是否自动加上import t 函数等。
增加在线可视化导出导入语言包，支持json、excel等。

新版本使用了AST来进行翻译文本的提取，也实现了一个wrap命令，可以实现自动包裹要翻译的文本，可靠性应该可以，但是是否100%防误杀，还需要实践考验

新版本t函数支持一个很有想象空间的特性，可以自定义翻译函数。

const i18nScope = new VoerkaI18nScope({
+   translate(result,message,args,options){
+        // 返回一个React组件
+        const T = ()=>{
+            const [result,setResult] = useState('')  
+              useEffect(()=>{
+                  const listener = this.on('change',()=>{
+                      setResult(this.t(message,args,options))
+                  })
+                  return ()=>listener.off()
+             },[])
+              return <span>{result}</span> 
+          }
+        return <T/>
+    })
     }
})

然后翻译函数t改成，

t("I am {}",['fisher'],{...options....})
// options传递给自定义的translate函数

这样，文件中的翻译内容就可以渲染成一个简单的Vue/React/Solid/Svelte/...等组件.

此特性可以有很大的想象空间

[zhangfisher]

请问能不能遵循 BCP47 规范，不然还得维护一套前后端语言代码对应的数据😭

新版本已遵循支持BCP47

[SKT1yang]

3.0新版本的runtime已基本重构完成，正在重构新版本的cli以及配套的工具。

“多库时Scope加载支持不依赖于加载顺序，可以在应用scope加载后再自动注册”能否能实现？各个渲染框架首次渲染时机不可控的，scope就算都加载好了，但是已经ui渲染好了，是否有必要限制主scope加载时机？

已经支持此特性

首次渲染和后续切换行为表现尽量简单和符合预期，比如localstorage中language的影响，scope加载顺序的影响。文档增加这部分图表式的说明，demo增加最小最佳实践和示例，统一各平台和框架差异。

在新版本下会重新编写各平台的Demo，也欢迎参与贡献

自动进行包裹要翻译的文本是可以实现的，就是看以什么方式实现，既能达到减少工作量的目的，又能100%防止误杀，建议有三种：1. 命令行；2. vscode插件；3. 嵌入eslint。各有优缺点，全量包裹还是部分文件或者文件夹包裹，是否自动加上import t 函数等。 增加在线可视化导出导入语言包，支持json、excel等。

新版本使用了AST来进行翻译文本的提取，也实现了一个wrap命令，可以实现自动包裹要翻译的文本，可靠性应该可以，但是是否100%防误杀，还需要实践考验

新版本t函数支持一个很有想象空间的特性，可以自定义翻译函数。

const i18nScope = new VoerkaI18nScope({

• translate(result,message,args,options){

•    // 返回一个React组件
  

•    const T = ()=>{
  

•        const [result,setResult] = useState('')  
  

•          useEffect(()=>{
  

•              const listener = this.on('change',()=>{
  

•                  setResult(this.t(message,args,options))
  

•              })
  

•              return ()=>listener.off()
  

•         },[])
  

•          return <span>{result}</span> 
  

•      }
  

•    return <T/>
  

• })
  }
  })
  然后翻译函数t改成，

t("I am {}",['fisher'],{...options....})
// options传递给自定义的translate函数

这样，文件中的翻译内容就可以渲染成一个简单的Vue/React/Solid/Svelte/...等组件.

此特性可以有很大的想象空间

速度可以啊，这个t函数组件可以，覆盖ui的实时切换渲染；还有一个特性今天刚想到，能不能index.ts在compile时不要修改，意图是new scope的时候 library、id等不要覆盖了，或者移到settings.json 里，甚至这个t渲染组件，也可以写到index.ts 导出。最后啥时候beta，我公司部分小项目试试水

[zhangfisher]

不错的主意，采纳:)