# gt: General Translation CLI tool: 使用自动 JSX 注入
URL: https://generaltranslation.com/zh/docs/cli/guides/using-auto-jsx.mdx
---

title: 使用自动 JSX 注入
description: 如何在构建时通过自动 JSX 注入，将可翻译的 JSX 文本包装在 General Translation 组件中。
related:
  links:
    - /docs/cli/guides/using-autoderive
    - /docs/cli/guides/generating-translations
    - /docs/cli/guides/configuring
    - /docs/cli/guides/managing-translations

---

自动 JSX 注入会让编译器在构建时，自动将可翻译的 JSX 文本包装到 [`<T>`](/docs/react/reference/components/t) 组件中，这样你就不必手动添加了。

默认情况下，自动 JSX 注入是禁用的。

*注意：自动 JSX 注入目前仅适用于 i18n-context 系统和单页 React 应用。*

## 启用自动 JSX 注入 [#enable]

在 `gt.config.json` 的 `files.gt.parsingFlags` 中设置 `enableAutoJsxInjection`。

```json title="gt.config.json"
{
  "files": {
    "gt": {
      "parsingFlags": {
        "enableAutoJsxInjection": true
      }
    }
  }
}
```

## 工作方式 [#how]

如果不使用注入，则需要你自己包装可翻译的文本。

```jsx
import { T } from 'gt-next';

function Welcome() {
  return (
    <T>
      <h1>Welcome to our app</h1>
    </T>
  );
}
```

启用注入后，编译器会检测可翻译的文本，并在构建时自动将其包裹起来。

```jsx
function Welcome() {
  return <h1>Welcome to our app</h1>;
}
```

你已经用 `<T>` 包裹的文本，以及其他 General Translation 组件 (如 [`<Var>`](/docs/react/reference/components/var)、[`<Branch>`](/docs/react/reference/components/branch)、[`<Plural>`](/docs/react/reference/components/plural) 和 [`<Derive>`](/docs/react/reference/components/derive)) 都将保持不变。
## Next steps

- /docs/cli/guides/using-autoderive
- /docs/cli/guides/generating-translations
- /docs/cli/guides/configuring
- /docs/cli/guides/managing-translations