# Linting Rules for gt-next: gt-next Lint
URL: https://generaltranslation.com/zh/docs/next-lint.mdx
---
title: gt-next Lint
description: 用于 gt-next 组件的 ESLint 插件。
---

<Callout type="warn">
  目前为 alpha 版本，后续可能会有变动。
</Callout>

用于捕获 gt-next 组件中常见翻译错误的 ESLint 插件。

## 安装

```bash
npm install --save-dev @generaltranslation/gt-next-lint
```


## 配置

将以下内容添加到你的 `eslint.config.mjs` 中：

```javascript
import gtNext from "@generaltranslation/gt-next-lint";

export default [
  {
    plugins: { 'gt-next': gtNext },
    rules: {
      'gt-next/no-dynamic-jsx': 'warn',
      'gt-next/no-dynamic-string': 'warn',
    },
  },
];
```


## 规则

### `no-dynamic-jsx`

使用变量组件将动态内容包裹在 `<T>` 组件内。

```jsx
// ❌ 错误
<T>Hello {userName}!</T>

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


### `no-dynamic-string`

仅允许在翻译函数中使用字符串字面量。

```jsx
const gt = useGT();

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

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


## 支持的组件

* `<Var>` - 变量
* `<DateTime>` - 日期
* `<Num>` - 数字
* `<Currency>` - 货币

## 支持的函数

* `useGT` - 客户端侧翻译

- `getGT` - 服务端翻译

## 配置预设

该插件内置了一个 `recommended` 配置预设：

```javascript
import gtNext from "@generaltranslation/gt-next-lint";

export default [
  gtNext.configs.recommended,
];
```

这会同时启用 `no-dynamic-jsx` 和 `no-dynamic-string`，并将其设为警告。