|Labs
デモを予約プラットフォーム
React (Lingo Compiler)
Alpha
React MCPReact (i18n)旧CLI(v0)
非推奨

Lingo.dev CLI

  • 仕組み
  • セットアップ
  • クイックスタート
  • モノレポ

設定

  • 対応フォーマット
  • i18n.json
  • i18n.lock
  • 対応ロケール

機能

  • 既存の翻訳
  • 言語を追加する
  • オーバーライド
  • 翻訳ノート
  • 翻訳キー
  • キーのリネーム
  • キーのロック
  • キーの無視
  • キー保持
  • AIでキーを抽出

パフォーマンス

  • 大規模プロジェクト
  • 並列処理
  • コスト見積もり

再翻訳

  • 自動再翻訳
  • 再翻訳
  • 翻訳を削除

このドキュメントは非推奨の旧CLI(v0)を対象としています。現行のCLIはv1です。 現行CLIのドキュメントを見る

AIでキーを抽出

Lingo.dev React MCP は、AI コーディングアシスタントが React のコードベースに国際化を導入するためのツールです。1つのプロンプトだけで、ロケール対応ルート、言語スイッチャー、ロケール検出までセットアップできます。Sequential Thinking MCP に着想を得ており、i18n のセットアップをエージェントが順を追って進めるガイド付きチェックリストに分解することで、キーの抽出から翻訳インフラの組み込みまで自動化します。

Lingo.dev MCP とは別物です

Lingo.dev React MCP は、React コードベースでの i18n のひな形作成に特化しています。一方、別の Lingo.dev MCP は、ローカライゼーションエンジン(用語集、ブランドボイス、スコアラー、モデル設定)を扱うためのものです。このページで扱うのは React MCP です。

仕組み#

Lingo.dev React MCP サーバーは、エージェントに4つのツールを提供します。

ツール目的
i18n_checklistセットアップ全体を進行管理するステップ形式の実装ガイドです。エージェントは各ステップでこれを呼び出し、次に何をすべきかを判断します。
get_project_contextプロジェクトのアーキテクチャ(フレームワーク、ルーター、ディレクトリ構成)を把握し、実装方針に反映します。
get_framework_docs検出したフレームワーク(Next.js、React Router、TanStack Start)の公式ドキュメントを取得します。
get_i18n_library_docsプロバイダーやコンポーネントの設定時に使う i18n ライブラリ(例: react-intl)のドキュメントを取得します。

i18n_checklist ツールが司令塔です。プロジェクト分析からロケールルーティング、翻訳設定、言語スイッチャー、ビルド検証まで、13のステップでエージェントを導きます。

実装されるもの#

Lingo.dev React MCP による一般的なセットアップでは、次のような構成が実装されます。

  • ロケール対応ルート - 現在のロケールが URL の先頭に付くルート(/en/about、/es/about)
  • 言語スイッチャー - 対応ロケールを切り替えるための UI コンポーネント
  • ロケール検出 - ユーザーの優先言語を自動で検出
  • 翻訳インフラ - コンポーネントからキーを抽出し、プロバイダー設定、翻訳ファイル、ヘルパー関数を整備

対応フレームワーク#

フレームワークバージョン
Next.js App Routerv13-16
Next.js Pages Routerv13-16
TanStack Startv1
React Routerv7

使い方#

Lingo.dev React MCP を AI コーディングアシスタントに接続したら、次のようにプロンプトします。

i18n をセットアップして

または、最初にロケールを指定しておくこともできます。

次のロケールで i18n をセットアップして: en、es、pt-BR。デフォルトロケールは "en" です。

エージェントはまず i18n_checklist を呼び出して開始し、その後はガイドに沿って必要に応じて他のツールも呼び出します。最終的に、フレームワークとプロジェクト構成に合わせた、実際に動作する i18n セットアップが完成します。

AI 支援コーディングは本質的に非決定的です。Lingo.dev React MCP はチェックリスト主導のアプローチで一貫性を高めますが、実際の結果は実行ごとに異なる場合があります。

次のステップ#

React MCP 概要
Lingo.dev React MCP の仕組みと実装内容
セットアップ
Lingo.dev React MCP を AI コーディングアシスタントに接続する
Claude Code
Claude Code でセットアップする
Cursor
Cursor でセットアップする

このページは役に立ちましたか?

Max PrilutskiyMax Prilutskiy·更新済み 2か月前·1分で読めます