リポジトリの接続

個々の画面を生成するのは、何かを新しく始めるときに最適です。Stitch に既存のアプリケーション、つまりルート、ナビゲーション、コンポーネント構造を理解させたいときは、リポジトリを Stitch ワークスペースに接続します。

一度接続すると、Stitch は実際のルートを調査し、プロダクトの優先事項と照らし合わせ、実際のコードベースに基づいた UI プロトタイプを生成できます。

ワークスペース機能を有効にする

初期状態では、@google/stitch CLI はキャンバスと DESIGN.md のコマンドに焦点を絞っています。お使いのマシンで stitch enable loop を実行し、ワークスペース機能を一度有効にします。

stitch enable loop

stitch enable loop を実行すると、すべてのワークスペースコマンド（workspace、priority、insight、solution、context、upload code、upload file、connect、github）が利用可能になり、インストール済みの /stitch スキル（.agents/skills/stitch/）が自動的に更新されてコードベースオンボーディングのプレイブックが含まれます。

ワークスペースコマンドを再び無効にしたいときは、stitch disable loop を実行します。

/stitch スキルでリポジトリをオンボーディングする

リポジトリを接続する最も簡単な方法は、/stitch スキルに手順を案内してもらうことです。スキルがインストールされていることを確認し（stitch agent-skills add）、リポジトリ内で /stitch を呼び出します。

コーディングエージェントはログイン状態を確認し、ワークスペースの選択または作成を手伝い、コードベースのスナップショットをアップロードし、ローカルの開発サーバーからライブのアプリケーションルートをキャプチャし、Stitch キャンバスプロジェクトをリンクします。使用するワークスペースやルートについてあなたの承認が必要なときだけ、処理を一時停止します。

ターミナルから接続する

セットアップコマンドを自分で実行したい場合は、次の 3 つのステップに従います。ワークスペースを選び、Stitch にコードへのアクセス権を与え、キャンバスプロジェクトをリンクします。

ワークスペースを作成して固定する

ワークスペースには、コードベースのスナップショット、優先事項、コンテキストファイル、インサイト、提案ソリューションが保持されます。既存のワークスペースを一覧表示するか新しく作成し、リポジトリに固定します。

stitch find workspaces --limit 10
stitch create workspace --title "Acme Web App"
stitch config set workspace <workspace-id>

ワークスペースを固定すると .stitch.json に保存され、毎回のコマンドで --workspace を渡す必要がなくなります。

コードベースをアップロードするか GitHub を接続する

次に、ワークスペースにソースコードへのアクセス権を与えます。最も速い方法は、ターミナルから git 管理下の作業ツリーを直接アップロードすることです。GitHub App のインストールは不要です。

stitch upload code .

Stitch を GitHub リポジトリと同期させ続けたい場合や、プルリクエストを自動で作成したい場合は、GitHub を直接接続することもできます。

stitch github login
stitch github repos
stitch edit workspace <workspace-id> --add-repo https://github.com/<owner>/<repo>

Stitch キャンバスプロジェクトをリンクする

最後に、Stitch キャンバスプロジェクトをワークスペースにバインドし、キャプチャしたルートと生成したプロトタイプが正しいキャンバスに配置されるようにします。

stitch loop link --project <project-id>

外部ツールを接続する

チームがプロダクトのコンテキストを外部ツールに置いている場合は、統合カタログを閲覧し、コネクションや Webhook をワークスペースに追加できます。

stitch connect --list
stitch connect <catalog-id>
stitch find connections