概要

withGTConfig は gt-next ライブラリを設定するための主な手段です。 NextConfig オブジェクトを直接ラップします。

import { withGTConfig } from 'gt-next/config';

const nextConfig = {
    // 既存のnext.config.jsの設定
}

export default withGTConfig(nextConfig, {
  // 追加の設定オプション
});

withGTConfig でできること:

• サポートする言語と既定の locale（フォールバック言語）を設定。
• GT サービスにアクセスするための API Keys とプロジェクト ID を設定。
• ローディング時の挙動を設定。
• timeout の設定を構成。
• カスタムエンドポイントを設定。
• 翻訳の挙動、キャッシュ、リクエストのバッチ処理をカスタマイズ。
• SWC プラグインによるビルド時検証を構成。

リファレンス

デフォルトでは、withGTConfig は next.config.js と同じディレクトリにある gt.config.json ファイルを探します。

この JSON ファイルは読み込まれ、withGTConfig に渡された設定とマージされます。

設定ファイルの詳細については、gt.config.json のリファレンスを参照してください。

必須の Props

推奨プロップ

高度なプロップス

戻り値

指定した GT の設定で Next.js の設定オブジェクトを拡張する (NextConfig) => NextConfig 関数。

例外

デフォルトのURLを使用している状態で projectId が未設定の場合、または APIキー が必須なのに未設定の場合に、Error をスローします。

レンダリング設定

レンダリング設定は、翻訳の読み込み中の挙動を制御します。 これはランタイムで実行される翻訳にのみ適用されます。 翻訳がキャッシュされている場合は、応答が十分に速いため、読み込み時の挙動を設ける必要はありません。

レンダリング方法

• skeleton: フラグメントを描画します。
• replace: 待機中はデフォルト言語のコンテンツを表示します。
• default: 同一言語のロケール（例: en-US と en-GB）では replace と同様に動作し、異なる言語のロケール（例: en-US と fr）では skeleton と同様に動作します。

タイムアウト

タイムアウトは、キャッシュされておらずオンデマンドで実行する必要があるランタイム翻訳にのみ適用されます。

タイムアウトの既定値は8秒です。 これは、無料プランでサーバーレス関数のデフォルトのタイムアウトが10秒に設定されている Vercel ユーザーに配慮した設計です。

例

レンダリング設定

この例では、翻訳の読み込み中にスケルトンを表示するように gt-next を設定します。 翻訳の読み込みに8秒以上かかると、メソッドはタイムアウトし、既定の言語コンテンツを表示します。

{
  "defaultLocale": "en-US",
  "locales": ["en-US", "es", "fr"],
}

import { withGTConfig } from 'gt-next/config';

const nextConfig = {
  // その他のNext.js設定
};

export default withGTConfig(nextConfig, {
  renderSettings: {
    method: 'skeleton',
    timeout: 10000,
  },
});

ビルド時の検証

この例では、SWC プラグインを設定し、動的コンテンツの違反を警告ではなくビルドエラーとして扱うようにします。

import { withGTConfig } from 'gt-next/config';

const nextConfig = {
  // その他のNext.js設定
};

export default withGTConfig(nextConfig, {
  // 動的JSX違反時にビルドを失敗させる
  dynamicJsxCheckLogLevel: 'error',
  // 動的文字列違反時に警告を出す  
  dynamicStringCheckLogLevel: 'warn',
});

注意事項

• withGTConfig は GT の翻訳機能を Next.js アプリに統合するもので、ルートの設定ファイルで必ず使用する必要があります。
• apiKey や projectId などのパラメータは、設定内で直接指定するか、環境変数として設定できます。
• renderSettings や _batchInterval といった高度なパラメータにより、翻訳の動作やパフォーマンスをきめ細かく制御できます。

次のステップ

• CDプロセス（継続的デリバリー／継続的デプロイ）に翻訳を組み込む