GitHub Copilotの代わりにGeminiを使うには

VS CodeでGeminiを使う VS Codeの使用法

VS Code(Visuial Studio Code)では、AIアシスタントとして「GitHub Copilot」が使用できます。
なかなか優秀で、エディタに「if」と入力するとそれに続く適切なコードを薄い文字色で補完してくれます。
もし、提案したものでOKなら「Tabキー」を押せば確定されます。
でも、実際に使ってみるとわかるんですけれど、GitHub Copilotのフリー(無料枠)は制限があり、すぐに使い切ってしまいます。
そこで、個人の開発者や趣味でプログラムしている程度であれば、ほぼ無制限といえる量が使えるGemini(Gemini Code Assist)に切り替える方法を紹介します。

VS CodeでGemini Code assistを使う

拡張機能「Gemini Code assist」をインストールする。

VS CodeでGeminiを使うには、拡張機能の「Gemini Code Assist」をインストールします。

拡張機能のアイコンをクリック

VS Codeの左側の「拡張機能」のアイコンをクリックし──

Gemini code Assitantと検索

①の検索欄に、

Gemini code Assist

と入力します。すると、いくつかヒット。
この中で「Google」が提供する(矢印の先)ものがそうです。

インストール」をクリックします。

Geminiのアイコンが表示

すると、左側にGemini code Assistのアイコンが表示されました。
このアイコンをクリックします。

Googleにログイン
Sign inをクリック

Sign in」をクリック。

Codeで外部のWebサイトを開きますか

するとこのようにポップアップで

Codeで外部のWebサイトを開きますか?

というダイアログが表示されるので、「開く」をクリック。

アカウントを選択してください

Googleアカウントのリストが表示されます。
もし、ログインが必要ならログインし、表示されているアカウントを選択します。

警告

このような警告が表示されます。
ログイン」をクリックします。

認証成功

認証成功」と表示されればOK。

Gemini code Assistを使う

GitHub Copilotを無効にする

まずはGitHub Copilotを無効にしよう。

GitHub Copilotを表示させる

①「拡張機能」のアイコンをクリックし、

②検索窓に「copilot」と入力。

③「GitHub Copilot Chat」をクリック。

無効にするをクリック

GitHub Copilot Chatが表示されるので、「無効にする」をクリックします。
これで、GitHub Copilotは使われなくなりました。

Gemini code Assitがオンになっているか確認
Gemini Code Assistがオン

Gemini Code Assistがオンになっていると、VS Codeの右下にこのようなアイコンが表示去るはずです。
ここが赤く斜線が表示されている場合は、Googleアカウントでログインしていない状態です。
左側のGeminiのアイコンをクリックし、「Sign in」をクリックしてブラウザでサインインしてください。

コードを補完してもらう

試しにエディタになにか入力してみます。すると・・・

コードが補完された

このようにコードが補完されました。

メイリオを修正

例えばこの

ctx.font = '16px メイリオ';

を「游ゴシック」に変更したい場合は、

// 游ゴシックに変更

というコメントを入力すると、ふさわしいコードの候補が表示されました。

選択した範囲を修正してもらう

例えば、複数の行に渡ってソースコードを修正したい場合は、修正したい範囲(もしくはそれ以上)を選択します。

修正したい範囲を選択

このように修正したい部分を選択したら、

Ctrl+Iキー(Macの場合、Cmd+I)を押します。

Geminiのアイコンをクリック

なお、Ctrl+Iキーを押さなくても、VS Codeの右上のGeminiのアイコンをクリックしても出来ます。

アシスタントが表示された

するとVS Codeの画面の上の方にこのような入力欄が表示されます。

Generate or update Gemini Outlineの上の入力欄に要望を入力します。(Select your Smart Action,Type….)の部分

/generate は、なにもない場所に新しくコードを生成したい場合に使います。

/fix 選択したコードに潜んでいるバグやエラー見つけ出し、修正案を提示してくれます。

Expanin this 選択した範囲のコードを日本語で説明してくれます。

Generate unit tests テストコードを自動で作成してくれます。

ボールの大きさを半分にする

するとしばらく考え中になり・・・

修正案が表示された

エディタの画面が分かれて、左側が現在のソースコード。右側がGeminiが提案してきた修正案になります。

Acceptか Declineを選択

小さい文字でわかりにくいのですが、VS Codeの右上の方に「Accept(承認)」か「Decline(拒否)」か選択するボタンが表示されます。
もし、この修正を受け入れるなら「Accept」の方をクリック。
不満があれば「Decline」をクリック。

なお、どちらかを選択すると、分割されたウインドウは元に戻ります。

修正を受け入れても、Ctrl+Zキーで元に戻せます。

修正された

修正されました。
Geminiは結構優秀で、選択範囲だけでなく他の修正する必要があるものすべてを提案してくれます。

Geminiと会話しながら0からゲームを作成する

サイドバーチャットを使えば、なにもない状態からプログラムを作り上げることも可能です。

Geminiに基本設計書を作ってもらった

「インベーダーゲームの設計書を書いて」と頼んでみたら、このように基本設計書が表示されました。

さらに次にどんな指示を与えればいいか、候補が表示されました。

次の指示が表示された

プログラムをAIを使って作成する場合は、一気に0から作成するのではなく、ブロックごとに作成していくのがセオリー。そこで──

次の指示を送る

ソースコード上に反映される

会話をしていくと、機能が追加されていきました。

機能が追加された

と、同時に、ソースコードの方にも反映されていました。

ソースコード上に反映された

提案を受け入れる場合は、「Accept」をクリックします。

Gemini code Assist トラブル集

VS CodeでGeminiをアシスタントとして使う場合のトラブル集です。

Gemini code Assitが使えない!?

もし、なにか入力してもうんともすんとも言わない場合、一度、VS Codeを終了し、起動し直してください。私の場合はそれで有効になりました。

チャットの返事が返ってこない

サイドバーチャットで、なにか質問や要望を送ってもぐるぐる回るだけで全然回答が返ってこない場合、「Agentモード」をオフにしてください。

Agentモード

上の画像はAgentモードをオフにした状態です。

Agentモードがオフに出来ない

Agentモードは途中でやめられません。このような警告が出た場合は、チャットを閉じる必要があります。

チャットを削除する

新しくチャットを開始するには、古いチャットを削除します。

まとめ

qwen3が作成した未完成のブロック崩しゲームをGemini code Assistを使って正常に動くまで修正し続けたのですが、GitHub Copilotと違い、ほぼ個人で使うには無制限に活用できるのですぐに完成させることが出来ました。

コメント

タイトルとURLをコピーしました