返回

@generaltranslation/react-core-linter@0.1.0

Ernest McCarter avatarErnest McCarter
react-core-linter0.1.0eslintlintingstatic-validation

概述

@generaltranslation/react-core-linter 0.1.0 为 General Translation React Core 集成提供了 ESLint 规则。

这个插件可以捕获我们在实际项目中经常遇到的实现错误。

安装

npm install @generaltranslation/react-core-linter --save-dev

此初始版本中包含两条规则:

  • static-jsx - 强制要求在 <T> 组件中对变量进行正确包裹
  • static-string - 确保翻译函数中使用静态字符串

静态 JSX 校验

static-jsx 规则会阻止在 <T> 组件中直接出现动态内容。 动态内容必须包裹在变量组件中。

// ❌ Wrong
<T>Hello {userName}!</T>

// ✅ 正确  
<T>Hello <Var>{userName}</Var>!</T>

静态字符串约束

static-string 规则确保翻译函数只能接受静态(不变)的字符串。

const gt = useGT();

// ❌ Wrong
gt(`Hello ${name}`)
gt('Hello ' + name)

// ✅ 正确
gt('Hello {name}!', { name })

配置

在你的 ESLint 配置中添加:

import { defineConfig } from 'eslint';
import gtLint from '@generaltranslation/react-core-linter';

export default defineConfig([
  gtLint.configs.recommended,
]);

该首个版本为 React Core 翻译模式提供了基础的 lint 功能。 后续版本将扩展规则覆盖范围,并为其他常见违规情况提供自动修复功能。


延伸阅读