高度な設定
Lingo.dev コンパイラーは、翻訳の動作をカスタマイズし、ローカリゼーションワークフローを最適化するための幅広い設定オプションを提供します。
設定パラメータ
プロジェクトにコンパイラを実装する際、以下のオプションを含む設定オブジェクトを渡すことができます:
// デフォルト設定
const compilerConfig = {
sourceRoot: "src",
lingoDir: "lingo",
sourceLocale: "en",
targetLocales: ["es"],
rsc: false,
debug: false,
models: {
// カスタムモデル設定
"*:fr": "mistral-saba-24b",
"en:es": "meta-llama/llama-4-maverick-17b-128e-instruct",
"*:*": "mistral-saba-24b",
},
prompt:
"You are AI translator. You translate from {SOURCE_LOCALE} to {TARGET_LOCALE}.",
};
// Next.js
lingoCompiler.next(compilerConfig)(nextConfig);
// Vite/React Router
lingoCompiler.vite(compilerConfig)(viteConfig);
設定オプション
sourceRoot
-lingo/
ディレクトリが格納されるソースディレクトリへのパスlingoDir
- 翻訳ファイルを含むディレクトリの名前(デフォルト:"lingo"
)sourceLocale
- アプリケーションのソース言語(デフォルト:"en"
)targetLocales
- 翻訳対象言語の配列rsc
- React Server Componentsのサポートを有効にする(デフォルト:false
)debug
- トラブルシューティング用のデバッグログを有効にする(デフォルト:false
)models
- 特定の言語ペア用のカスタムAIモデル設定(オプション)prompt
- プレースホルダーを含むカスタム翻訳プロンプト(オプション)
推奨Groqモデル
最良の結果を得るために、特定のロケールに対して以下のGROQモデルの品質をテストおよび検証しました:
mistral-saba-24b
- ar - アラビア語
- de - ドイツ語
- fr - フランス語
- pt-BR - ポルトガル語(ブラジル)
meta-llama/llama-4-maverick-17b-128e-instruct
- es - スペイン語
- ja - 日本語
- ko - 韓国語
- ru - ロシア語
- zh - 中国語
ファイル処理制御
翻訳のスキップ
翻訳したくない要素に data-lingo-skip
属性を追加します:
<div data-lingo-skip>このコンテンツは翻訳されません</div>
翻訳の上書き
特定のロケールの翻訳を data-lingo-override-
属性を使用して上書きします:
<button data-lingo-override-es="¡Hola!" data-lingo-override-fr="Bonjour!">
Hello
</button>
カスタムモデル設定
コンパイラ設定で直接AIモデルとプロンプトをカスタマイズできます:
const compilerConfig = {
sourceLocale: "en",
targetLocales: ["es", "fr", "de"],
models: {
"*:fr": "mistral-saba-24b",
"en:es": "meta-llama/llama-4-maverick-17b-128e-instruct",
"es:fr": "meta-llama/llama-4-maverick-17b-128e-instruct",
"*:*": "mistral-saba-24b",
},
prompt:
"You are a professional translator specializing in technical documentation. Translate from {SOURCE_LOCALE} to {TARGET_LOCALE} while maintaining technical accuracy.",
};
モデル設定
- ロケールペアを
source-locale:target-locale
として定義 - 任意のロケールに
*
をワイルドカードとして使用 - すべての翻訳のフォールバックとして
*:*
を使用 - 利用可能なオプションについてはGROQモデルを参照
カスタムプロンプト
プレースホルダーを使用してカスタム翻訳プロンプトを定義できます:
{SOURCE_LOCALE}
- ソース言語コード{TARGET_LOCALE}
- ターゲット言語コード
カスタム用語集を構築するには、プロンプトに専門用語を含めてください。ベストプラクティスについてはデフォルトのコンパイラプロンプトを参照してください。
ビルド正規化
変更をコミットする前に、常にローカルで本番ビルドを実行してください:
npm run build
これにより、lingo/
ディレクトリ内のmeta.json
とdictionary.js
ファイルにアプリに存在する文字列のみが含まれ、適切にフォーマットされていることが保証されます。
プリコミットフックの設定
huskyを使用して自動正規化を設定します:
# huskyをインストール
npm install --save-dev husky
# プリコミットフックを追加
npx husky add .husky/pre-commit "npm run build"
環境固有の設定
開発環境
const isDev = process.env.NODE_ENV === "development";
const compilerConfig = {
debug: isDev,
targetLocales: isDev ? ["es"] : ["es", "fr", "de", "ja"],
};
CI/CD統合
自動ビルドでは、CI環境がGROQ APIキーにアクセスできることを確認してください:
# GitHub Actions
GROQ_API_KEY: ${{ secrets.GROQ_API_KEY }}
# Vercel
GROQ_API_KEY=gsk_...
# Netlify
GROQ_API_KEY=gsk_...
パフォーマンス最適化
インクリメンタルビルド
コンパイラは自動的に以下を行います:
- ファイルフィンガープリントによるコンテンツ変更の追跡
- 新規または変更されたコンテンツのみを翻訳
- 変更されていないコンテンツに対する既存の翻訳の再利用
バンドル最適化
- ロケールごとのバンドル - アクティブなロケールの翻訳のみを読み込み
- ツリーシェイキング - 本番ビルドから未使用の翻訳を削除
- コード分割 - ルートベースのアプリケーション向けにオンデマンドで翻訳を読み込み
トラブルシューティング
デバッグモード
問題のトラブルシューティングにはデバッグログを有効にしてください:
const compilerConfig = {
debug: true,
// ... その他のオプション
};
一般的な問題
翻訳の欠落:ローカルでnpm run build
を実行し、lingo/
ディレクトリをコミットしたことを確認してください。NextJSを使用している場合は、すべてのファイルが再ビルドされるように.next/
ディレクトリを削除する必要があるかもしれません。
ビルドエラー:環境変数にGROQ_API_KEY
が適切に設定されていることを確認してください。
パフォーマンスの問題:コンパイルプロセスのボトルネックを特定するためにデバッグモードを有効にしてください。
次のステップ
- FAQ:よくある質問とトラブルシューティング
- フレームワークガイド:Next.js、React Router、Vite
- 仕組み:ビルドプロセスの理解