📌

Vscode上でContinue＋Azure OpenAIのAIコーディング環境作成

に公開
AI
VS Code
VS Code 拡張機能
continue
tech

はじめに

普段、個人で開発で開発を行う場合はCursorを使用していますが、AIを用いた開発環境を社内で用意したいと思い調べたところ、vscode拡張機能として、Continueがあったため、調査してみました。
前提として、社内ではLLMとしてAzureOpenAIのみしか利用できず、CursorやGituhubCopilot等のについては、有料となるためすぐに利用できない状況でした。
そこで、無料で利用できて、コード解説,コード補完,コード編集,AIエージェントによる実装が可能なものを探していました。

Continueについて

Continueは、オープンソースのAIコード支援拡張で、以下のような機能を備えています。

  • チャット機能

    • @file、@code、@git diff、@docs、@searchなどの**@コンテキスト**で、必要な情報を会話に添付しやり取りができます。
    • 仕様相談、設計レビュー、要約、コード解説などに役立てることができます。

  • コード補完

    • コード単一行や全体に対して、Tabでの自動補完を行ってくれます。また、コメントに対してのコード補完も行ってくれます。

  • コード編集

    • コードを選択→指示→差分（diff）プレビュー→受入/却下という流れで、コードの編集を行うことができます。

  • AIエージェントによる実装

    • 依頼を計画→編集→実行とAIが自律的にコードの編集を行うことができます。

https://docs.continue.dev/

導入方法

拡張機能からインストールを実施

導入すると、以下のようにcontinueが表示されます。

LocalAgentとして、AzureOpenAIを使用するための設定を行います。
デフォルトでインストールしている場合、C:\Users\ユーザ名.continueにあるconfig.yamlファイルの編集を行います。

name: Local Agent
version: 1.0.0
schema: v1
models:
  - name: Llama 3.1 8B
    provider: ollama
    model: llama3.1:8b
    roles:
      - chat
      - edit
      - apply
  - name: Qwen2.5-Coder 1.5B
    provider: ollama
    model: qwen2.5-coder:1.5b-base
    roles:
      - autocomplete
  - name: Nomic Embed
    provider: ollama
    model: nomic-embed-text:latest
    roles:
      - embed
# 以下を追加
  - name: Azure GPT-4.1 Mini
    provider: azure
    model: gpt-4.1-mini
    apiBase: https://oai-tryagapp-20250824.openai.azure.com
    apiKey: APIキー記載
    env:
      deployment: gpt-4.1-mini
      apiType: azure-openai
      apiVersion: 2025-01-01-preview
    roles:
      - chat
      - edit
      - apply

AuzreOpenAI側でデプロイしたモデル情報、apiBase：URL　apiKey：APIキー　deployment：デプロイ名を入力します。

設定が完了すると、以下のように選択できるモデルに、AzureOpenAIのモデルが表示されます。

チャット機能

  • コードの一部を選択を含めてチャットを実施
    プログラムコードの一部を選択してCtrl＋lで、チャット欄に入力することができます。
    質問を追記することでコードの確認をAIに行うことができます。

  • ファイル自体を指定してチャットを実施
    @Filesからファイルを選択することで、指定したファイルについて、AIに質問することができます。

コード補完

コード補完について、デフォルトのmodel: qwen2.5-coder:1.5b-baseを使用する場合、ollamaのインストールが必要です。
https://ollama.com/

ollamaのインストール後、以下のコマンドを実施します。

ollama pull qwen2.5-coder:1.5b-base

上記設定のみで、Tab補完を利用できれば問題ないのですが、私の環境では、うまく動作しませんでした。そこで、以下の設定を行うことで利用できるようになりました。

settings.json
  "editor.tabCompletion": "on",
  "editor.inlineSuggest.enabled": true,
  "editor.suggest.showInlineSuggestions": true
}

vscodeのsetting.jsonについて、上記を追加・修正しました。
そのうえで、vscode右下のContinue＞「Enabel autocomplete」を有効にしました。

以上の設定をすることで、Tab補完機能を利用することができるようになりました。

  • Tab補完
    CursorやGituhubCopilotのようにコードを書くと、自動でコード補完を行ってくれます。
    Tabでその内容を確定させることができます。
    自身でコードを書く場合、Tab補完があるのとないのとでは、コーディングスピードが格段に変わります。

  • コメントとTab補完
    コメントを書くと、そのコメントに沿ったコードが自動で提案されます。
    こちらもコーディング時のコーディング補助となり、非常に便利です。

コード編集

コード編集を行いたい部分について選択し、Ctrl＋Iを押した状態で、変更したい内容をプロンプトに書き実行すると、コード編集を行います。
以下のようにインラインで変更前、変更後を表示してくれます。
軽微な修正で、修正すべきコードの特定を自身でできている場合などによく使用します。

AIエージェントによる実装

最後に、計画～変更まですべて一気通貫で行ってくれる機能として、エージェントモードがあります。
エージェントモードには、以下の2種類があります。

  • plan
    • コードベースへの読み取り専用モードです。コードの変更を一切行わず、変更計画やコードの理解を補助してくれます。
  • agent
    • コードの変更、バグの修正、コマンドの実行を自動的に実施します。

plan

planモードでは、コードの変更計画を作成できます。変更要望などをもとにコードのどの部分を修正すべきかなどを提案してくれます。変更自体は行わないため、planで内容を確認してから自身で必要な部分の修正を行うといったことも可能です。
また、他人が書いたコードについて理解する際も使用することができます。

agent

agentモードでは、プロンプトで指示した内容をもとに計画～実行まですべて実施してくれます。
こちらは、要望に対して、1からコードを作成するときなどに使用します。
まずは、エージェントモードで、一通り作成してもらってから、エラー箇所や、修正したい部分を適宜修正することが多いです。

まとめ

vscode拡張機能として、Continueを確認してみました。
コード補完はやはり、CursorやGituhubCopilotのほうがやはり優秀ですが、それ以外については、LLMにAzureOpenAIを利用しているおかげか、良い回答が得られています。
無料で利用できる機能としては十分すぎるほどです。
統合開発環境に、AIが搭載されているか、されていないかで生産性は5倍くらい変わってくるので、CursorやGituhubCopilotを利用できない環境下ではContinueを入れて積極的に利用していきたいと思いました。

Discussion