gt-next Lint
gt-next コンポーネント向けの ESLint プラグイン。
GT Next Lint
これはアルファ版です。今後変更される可能性があります。
gt-next コンポーネントでよく起こる翻訳ミスを検出する ESLint プラグインです。
インストール
npm install --save-dev @generaltranslation/gt-next-lint設定
eslint.config.mjs に次を追加します:
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> コンポーネントでラップします。
// ❌ 誤り
<T>Hello {userName}!</T>
// ✅ 正しい
<T>Hello <Var>{userName}</Var>!</T>no-dynamic-string
翻訳関数では文字列リテラルのみを使用します。
const t = useGT();
// ❌ 誤り
t(`Hello ${name}`)
t('Hello ' + name)
// ✅ 正しい
t('Hello, {name}!', { name })サポート対象のコンポーネント
<Var>- 変数<DateTime>- 日付<Num>- 数値<Currency>- 通貨
サポートされている関数
useGT()- クライアント側での翻訳getGT()- サーバー側での翻訳
このガイドはいかがですか？