<T> ラッピング動作

CLI ツールが `<T>` コンポーネントをラップする具体的な動作

概要

このページでは、CLIツールが<T>コンポーネントをラップする正確な動作について説明します。

原則として、CLIは静的で意味のあるコンテンツの周りに<T>コンポーネントをラップします。また、<T>コンポーネント内に含まれる動的なサブコンテンツの周りには<Var>コンポーネントをラップします。

例えば、以下のようなコンテンツは<T>コンポーネントでラップされます：

<div>Hello, World!</div> -> <T id="SOME_ID"><div>Hello, World!</div></T>

しかし、以下のようなコンテンツはラップされません：

<div><img src="logo.png" /></div> -> <div><img src="logo.png" /></div>

CLIツールは常に最終的な出力が有効なJSXであり、<T>コンポーネントを正しく使用していることを確認します。

論理演算子などの場合には、より良い翻訳とより多くのコンテキストを確保するために、人間の介入が役立つ場合があります。

バグや予期しない動作がありましたら、Githubで報告してください。

CLIは自動的に式{...}を<Var>コンポーネントでラップします。これは、式が通常動的であるためです。

<div>Hello, {name}</div> -> <T id="SOME_ID"><div>Hello, <Var>{name}</Var></div></T>

<Var>コンポーネント内のコンテンツは翻訳されません。

動的コンテンツを翻訳したい場合は、代わりに<Tx>コンポーネントを使用する必要があります。

式ラッピングルールの例外は、式に静的コンテンツが含まれている場合です。

例えば、以下は<Var>コンポーネントでラップされません：

<p>{"Hello," + " World!"}</p> -> <T id="SOME_ID"><p>{"Hello," + " World!"}</p></T>

CLIは、準静的部分（${}）を含むテンプレートリテラルを<Var>コンポーネントでラップします。これらは動的になる可能性があるためです。

<p>{`${temp}`}</p> -> <T id="SOME_ID"><p><Var>{`${temp}`}</Var></p></T>

&&、||、?などの論理演算子を含むJSX式は、トップレベルで<T>コンポーネントが必要な場合（つまり、式の外側に他の意味のあるコンテンツがある場合）、<Var>コンポーネントでラップされます。

バグや予期しない動作がある場合は、Githubで報告してください。

CLI は自動的に式 {...} を <Var> コンポーネントでラップします。これは、式が通常動的であるためです。

<div>Hello, {name}</div> -> <T id="SOME_ID"><div>Hello, <Var>{name}</Var></div></T>

<Var> コンポーネント内に含まれるコンテンツは翻訳されません。

動的コンテンツを翻訳したい場合は、代わりに <Tx> コンポーネントを使用する必要があります。

式ラッピングルールの例外は、式に静的コンテンツが含まれている場合です。

例えば、以下は <Var> コンポーネントでラップされません：