Panda I18N

Panda I18N 的 'VS Code' 插件工具，让项目支持多语言，基于 AST 语法分析完成文案提取、命名和替换，高亮出字符串，并且自动生成相关依赖， 让一个应用在二十秒内具有多语言切换能力。整个改造过程几乎不需要任何的开发成本。

• vscode 插件 ，自动识别文案
• vscode 插件， 提取文案上传到 Panda 语言包，自动检索匹配文案、新增文案、自动生成 key
• vscode 插件，文案替换 {$i18n.get({id:"welcome_rhnlna",dm:"欢迎使用"})
• 配套 Panda 文案管理平台，标准化开发流程

如何使用

VS Code 插件搜索 Panda I18N 安装

安装成功后，command + shift + p 唤起命令行

命令-文案识别标识(当前文件): Panda:Search inside Current File for I18N(mcms) Strings(查找当前文件中的所有文案)

命令-文案上传语言包: Panda:Upload Strings to Panda Pack(上传文案到语言包)

命令-国际化文案: Panda:Format Strings to Support I18n(根据语言包格式化代码)

配置项

项目根目录下创建 panda.config.js

配置项参考: https://yuque.antfin-inc.com/ioc-doc/must-doc/qsgpqk

样例如下

module.exports = {
  extract: {
    name: 'gwms-aer',
    sourcePath: 'src',
    fileType: 'js',
    prettier: false,
    debug: false,
    strict: false, //是否为严格模式，非严格模式下，"查询","查询+" ,"查询:"等会被同一个词替换
    runtimeCheck: false, //文档更新时是否实时监测当前文档文案变化 ,从而找到匹配的文案
    include: (path) => {   // 需要匹配的文件路径  
     //  return path.includes('src/pages/outbound'); // 
    //   // return path.includes('src/components'); // 
    // },
    exclude: (path) => {  //需要排除的文件路径
      return path.includes('.scss'); // 不处理 widgets 下的文件
    },

    medusa: {  //这里不用填
      appName: '',
    },
    pack: {
      id: 12,
      version: 1,
      env: 'pre',
    },

    macro: {
      path: 'src/i18n',
      method: '$i18n.get({id:"$key$",dm:"$defaultMessage$"})',
      import: 'import $i18n from "@alife/panda-i18n"',
      keySplitter: '.',
      showComment: true, //一些特殊替换的场景下，显示出文案注释，如 "查询+", "查询-"替换时，会在文案盘增加注释
      placeholder: (variable) => {
        return `{${variable}}`;
      },
      keyGenerator: (copy, filePath, config) => {
        const convertToCamelCase = (str) => {
          // 去除中划线分隔符获取单词数组
          let strArr = str.split(' ');
          // 如果第一个为空，则去掉
          if (strArr[0] === '') {
            strArr.shift();
          }
          // 遍历第二个单词到最后一个单词，并转换单词首字母为大写
          for (let i = 1, len = strArr.length; i < len; i++) {
            // 如果不为空，则转成大写
            if (strArr[i] !== '') {
              strArr[i] = strArr[i][0].toUpperCase() + strArr[i].substring(1);
            }
          }
          return strArr.join('');
        };
        let selfKey = convertToCamelCase(copy['en-US']);
        console.log(selfKey, 'selfKey');
        return selfKey;
      },
      dependencies: ['@ali/global-locale', '@ali/global-string-format'],
    },
    babel: {
      allowImportExportEverywhere: true,
      decoratorsBeforeExport: true,
      plugins: [
        'asyncGenerators',
        'classProperties',
        'decorators-legacy',
        'doExpressions',
        'exportExtensions',
        'exportDefaultFrom',
        'typescript',
        'functionSent',
        'functionBind',
        'jsx',
        'tsx',
        'json',
        'objectRestSpread',
        'dynamicImport',
        'numericSeparator',
        'optionalChaining',
        'optionalCatchBinding',
      ],
    },

    isNeedUploadCopyToMedusa: true,
    sourceLang: 'zh-CN',   //源语言
  },
  import: {    
    type: 'json',
    path: 'src/i18n',
    medusa: {
      appName: '',
    },
  },
};