如何自动查找React项目中未用i18n t()包裹的未翻译字符串？

静态代码分析工具（推荐） #

• 借助ESLint自定义规则或现成插件：通过抽象语法树（AST）遍历代码，识别所有未被t()函数包裹的字符串字面量。也可以用社区现成的eslint-plugin-i18n类插件，配置规则后运行eslint，直接输出未翻译字符串的位置和内容。
• 核心逻辑：检查CallExpression节点，若字符串节点的父节点不是t函数调用，则标记为未翻译项。

正则表达式快速排查 #

• 针对项目文件类型编写正则，匹配未被t()包裹的字符串。例如JS/TS文件可用正则：/(?<!t\()['"]([^'"\n]+)['"]/g，注意过滤注释中的字符串、模板变量插值等特殊情况。
• 执行方式：用grep命令批量扫描文件，或写简单Node脚本遍历项目目录，对每个文件执行正则匹配并收集结果。

IDE插件辅助 #

• 用VS Code的i18n Ally插件：配置好项目的i18n资源路径和翻译函数名（比如t）后，插件会自动扫描整个项目，高亮显示未被翻译函数包裹的字符串，侧边栏可统计未翻译数量，点击即可定位到对应代码行。

自定义脚本解析AST #

• 用@babel/parser或acorn解析代码生成AST，遍历所有Literal（字符串字面量）节点，检查其上下文是否是t()函数的参数。若不是，则记录字符串内容、所在文件路径和行号，最后统一输出结果。
• 核心代码示例：

const parser = require('@babel/parser');
const traverse = require('@babel/traverse').default;
const fs = require('fs');

function checkFile(filePath) {
  const code = fs.readFileSync(filePath, 'utf8');
  const ast = parser.parse(code, { sourceType: 'module' });
  traverse(ast, {
    Literal(path) {
      if (typeof path.node.value === 'string' && path.node.value.length > 0) {
        const parent = path.parent;
        if (!(parent.type === 'CallExpression' && parent.callee.name === 't')) {
          console.log(`未翻译字符串："${path.node.value}"，位置：${filePath}:${path.node.loc.start.line}`);
        }
      }
    }
  });
}

内容的提问来源于stack exchange，提问作者kkkkkkkkkkkkkkkkk