tl;dr
本記事ではWindows11 Home 24H2で動作確認しています。
- GitHubの無料アカウントを作成する
- 無料版GitHub Copilotを利用可能にする
- node.jsをインストールする
- Recline-legacyをVS Code拡張機能としてビルドする
- Recline-legacyをVS Codeにインストールする
- Recline-legacyのLLM ModelにGitHub Copilotを選択する
- Recline-legacyからの応答を日本語化する
- プロンプトを入力してコードを生成する
手順
すでにお手元の環境に揃っているものの手順は適宜スキップしてください。
1. GitHubの無料アカウントを作る
- GitHub公式サイトにアクセスする
- 右上の「Sign up」ボタンをクリックする
- メールアドレスを入力する
- パスワードを設定する
- ユーザー名を入力する
- メールでマーケティング情報を受け取るかどうかの質問に回答する
- CAPTCHAを完了して「人間」であることを証明する
- 「Create account」ボタンをクリックする
- 登録したメールアドレスに届いた確認コードを入力する
- 使用方法に関するいくつかの質問に回答します（チームサイズ、GitHubの使用目的など）
- 無料プランを選択する
- アカウント設定を完了して、GitHubダッシュボードにアクセスする
公式ドキュメント：GitHub でのアカウントの作成 - GitHub Docs
2. 無料版GitHub Copilotを利用可能にする
- GitHub Copilotの公式ページにアクセスする
- ページ右上のプロフィール写真をクリックし、ドロップダウンメニューから「Your Copilot」を選択する
- 表示されたページで、「Start using Copilot Free」をクリックする
- 画面の指示に従って、VS CodeにGitHub Copilot拡張機能をインストールする。以下のコマンドでもインストールできる
GitHub Copilot拡張機能のインストールコマンド
code --install-extension github.copilot code --install-extension github.copilot-chat - VS Codeの左下にある下から2番目のアイコンからGitHubアカウントにサインインし、GitHub Copilotの利用を開始する
公式ドキュメント：GitHub Copilot のクイック スタート - GitHub Docs
3. node.jsをインストールする
プロジェクトごとのバージョン指定が可能になるので、Windows11環境ではwingetを使用してVoltaをインストールします。
- Windows terminalからPower Shellを起動する
- 次のコマンドを実行する：
node.jsのインストール
# もし初めてwingetを利用するときはMS StoreとMicrosoft Terminalの # アップデート後、Windows Terminalの再起動が必要になります。 winget update winget upgrade --all # 下記オプションは本当にインストールするかどうかの問い合わせに自動的にyesと回答するもの winget install Volta.Volta Git.Git --disable-interactivity --accept-package-agreements # 下記コマンドでWindowsに最新安定版のnode.jsがインストールされる volta install node
4. Recline-legacyをVS Code拡張機能としてビルドする
GitHubのリポジトリ: julesmons/recline-legacy
- 次のコマンドを実行する：
Recline-legacyのビルドツールの構築
# Recline-legacyをインストールする環境を整える # あらかじめ作業用のフォルダで移動しておくと良い npm install -g pnpm # pnpmのパスを通したりモジュールを保存する場所を自動的にセットアップする pnpm setup # VS Codeのパッケージ作成用ツールのインストール pnpm install -g @vscode/vsce@3.3.2 # GitHubからRecline-legacyのリポジトリ（ソースコード）をダウンロードする git clone https://github.com/julesmons/recline-legacy.git cd recline-legacy # Recline-legacyをビルドしてインストール可能にする pnpm install pnpm package
5. Recline-legacyをVS Codeにインストールする
- 次のコマンドを実行する：
ビルドしたVS Code拡張機能をインストールする
code --install-extension .\recline-0.2.5.vsix
6. Recline-legacyのLLM ModelにGitHub Copilotを選択する
VS Codeを起動して、リクライニングした座席のアイコンから、Recline-legacyを起動します。
最初にセットアップ画面が表示されますので、以下の設定を行ってください。
-
API Provider:
VScode Language Model API -
Language Model:
copilot / claude-3.5-sonnet※ここはGitHub Copilotを選択してください。お好みでcopilot / gpt-4oでも良いでしょう
Doneボタンをクリックして、設定を完了します。
7. Recline-legacyからの応答を日本語化する
- VS Codeから再度Recline-legacyを起動する
- 右上の歯車のアイコンから設定画面を開く
- Custom Instructions欄に「Win11です。日本語で対話して」と入力する
- Doneボタンをクリックして、設定を完了する
8. プロンプトを入力してコードを生成する
あらかじめコードを生成して保存したいフォルダを作成し、そのフォルダをVS Codeで開いておいてください。
- アクティビティバーのRecline-legacyアイコンをクリックする
- プライマリサイドバーの一番下のテキスト入力欄に、作成したいコードのプロンプトを入力する
- Recline-legacyがプロンプトを解釈し、実行するタスクリストと編集対象のファイル名がプライマリサイドバーに表示され、エディタ領域には生成予定のソースコード差分が表示される
- プライマリサイドバー下にある「Save」ボタンを押すとソースコード差分やファイルの作成・削除が実行される。Saveする前にプロンプトを入力することで編集方針を修正することができる
もしHTMLファイルなどの開くことが可能な出力であった場合、その出力を開くコマンドの内容とそのコマンドの実行する許可を求めてくることがあります。
もしそのコマンドの実行に問題がなければ「Run Command」ボタンをクリックすると、そのコマンドを実行してくれます。
Custom InstructionsにWindowsであることを明記しないとmacOSやLinux用のopenコマンドで開くことを提案してきます。
プロンプト例
画面の中央に"Hello,world!"と表示するhtmlページを作成してください。
トラブルシューティング
そもそもwingetが動かない
Windows10の場合はあらかじめMicrosoft Storeがインストールされておらず、wingetが動作しない可能性があります。
その場合は公式ダウンロードURLからwingetののzipファイルをダウンロードし、インストールしてください。
wingetでVoltaがインストールできない
もし初めてwingetを利用するときはwingetでMS StoreとMicrosoft Terminalのアップデート後、wingetを実行しているWindows Terminalの閉じて開き直す必要があります。
pnpmが実行できない
pnpmを実行できないときは、Windows Terminalを閉じて開き直すと設定が確実に反映されます。