@tenado/i18n-cli v1.3.18

介绍

i18n-cli 是一个自动国际化脚本，通过执行命令，自动提取代码里面的中文，自动调用百度或谷歌翻译接口，自动将翻译结果以 key-value 形式存入*.json 语言包里。

支持 vue 语法，支持 jsx 语法，，支持 html 语法，i18n-cli 是一个和库无关的国际化脚本。

特别提示

提示：以脚手架的形式安装i18n-cli，可能会因为依赖版本冲突的问题导致转换失败，这种情况下可以下载github上的仓库代码，配置i18n.config.js后，将需要翻译的文件夹拷贝到仓库下，然后执行npm run sync

使用

0、环境

node > 15.0.0

1、安装

npm install @tenado/i18n-cli -D
或
yarn add  @tenado/i18n-cli -D

2、初始化

执行如下命令，会在项目目录下生成一个i18n.config.js文件，里面记录了脚本执行时候需要的配置

npx i18n-cli init

3、获取并配置百度翻译 api

• 进入百度翻译开放平台https://fanyi-api.baidu.com/manage/developer，申请 APP ID 和秘钥。

• 将获取到的APP ID 和秘钥填入i18n.config.js文件下的translate.appId和translate.secretKey并保存

4、配置 i18n.config.js

语言 key 映射：

5、自动转换

npx i18n-cli sync

特别说明：可以使用npx i18n-cli extract和npx i18n-cli translate代替如上命令，分步骤执行，1)提取代码里面的中文部分，2)翻译提取到的中文

转换示例

转换前

<template>
  <div class="empty-data">
    <div class="name">{{ name }}</div>
    <template>
      <div class="empty-image-wrap">
        <img class="empty-image" :src="emptyImage" />
      </div>
      <div class="empty-title">暂无数据</div>
    </template>
  </div>
</template>

<script lang="js">
import Vue from "vue";
export default Vue.extend({
  data(){
    return {
      name: "测试"
    }
  },
});
</script>

转换后

<template>
  <div class="empty-data">
    <div class="name">{{ name }}</div>
    <template>
      <div class="empty-image-wrap">
        <img class="empty-image" :src="emptyImage" />
      </div>
      <div class="empty-title">{{ $t("zan-wu-shu-ju") }}</div>
    </template>
  </div>
</template>

<script lang="js">
import { i18n } from 'i18n';
import Vue from "vue";
export default Vue.extend({
  data() {
    return {
      name: i18n.t('ce-shi')
    };
  }
});
</script>

TODO issue

• 处理在转换 html 的时候，大写的标签会自动转换为小写

• html里面标签转换错误，<datasetDetailsDialog></datasetDetailsDialog>

• 已经转换的代码，不需要再次转换

• 处理格式为:name="'测试'"类型的数据

• 大写的属性被转换掉了，例如<div originType="WORKSPACE"></div>

• 自闭和标签的解析，例如<Toast />

• console.log 不需要翻译

• disabled-i18n 添加

• 多个 template 标签解析报错

• form 里面的规则报错，:rules="{ required: true, message: '请输入名称', trigger: 'blur' }"

• ts 里面强制类型转换const arrs = <any>[]arr