# gt: General Translation CLI tool: 自動 JSX インジェクション を使う
URL: https://generaltranslation.com/ja/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>` でラップされているテキストは、[`<Var>`](/docs/react/reference/components/var)、[`<Branch>`](/docs/react/reference/components/branch)、[`<Plural>`](/docs/react/reference/components/plural)、[`<Derive>`](/docs/react/reference/components/derive) などの他の General Translation コンポーネントと同様に、そのまま保持されます。
## Next steps

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