🧠

VSCodeのチャット上でRAGを作成できる拡張機能をリリースしました🎉

に公開

はじめに🚀

この度「Dev Insights」というVSCodeのチャット上で簡単に自分だけのRAGを作成できる拡張機能をリリースしました🎉

📥 インストールはこちらから ⬇️
https://marketplace.visualstudio.com/items?itemName=KenIshii.devinsights&ssr=false#overview

拡張機能の紹介📢

デモ

機能自体は非常にシンプルです。
/importFilesというコマンドでファイルを取り込み、@devinsightsで会話ができます。
以下のデモ動画では本拡張機能について記載したmdファイルを取り込んだ後に、説明してもらっています。

使用方法

  1. お使いのVSCodeに本拡張機能をインストールします。
  2. 好きな環境にChromaDBを立てます。
    • docker-composeを使う場合はこちらを参考にしてください。
  3. ポートの都合などでhttp://localhost:8000以外にサーバーを構築している場合は、VSCodeの 設定 > Dev Insights › Document Vector DB: Endpointでエンドポイントの設定を行ってください。
  4. (任意) Dev Insights › Document Vector DB: Max ResultsからChromaDBから取得する最大結果数を変更できます。Copilotに渡されるトークンが多すぎてエラーになる場合はこちらで調整してください。

開発の経緯 🔍

課題感

  1. プロジェクトに新規で参加したメンバーが、様々な場所に点在するドキュメントや実装を見て情報収集するのに苦労しており効率が悪い
  2. 今から全てのドキュメントを書き直して容易に検索できるようにするのは現実的ではない
  3. クラウドでRAGを構築する方法は多々あるがどうしても多少コストと構築の手間がかかる

こうした課題を日々感じていた中で、ふと
GitHub Copilotはすでに契約してるし、ローカルでベクトル検索してCopilotに渡して回答を得られれば追加料金がかからないのではないか
と思いつきました。

調査

GitHub Copilot Chatの拡張

善は急げということで、早速GitHub Copilotを拡張する方法を調べ始めました📕

すると以下の二つの存在を知ります。

前者はGitHub Appを使ってGitHub Copilotを拡張できるものですが、特にOrganizationのGitHubにGitHub Appを作成するのは何かと面倒なためなしです。

後者は拡張機能を使ってVSCodeのLanguage Model APIを呼び出すことで、GitHub Copilot Chatと統合ができます。これであればユーザーは拡張機能をインストールして、あとはローカルにベクトルDBを構築するだけでRAGが構築できるため良さそうです。

ローカルで使えるベクトルDB

今回はローカルで完結するベクトル検索を実現するために、ChromaDBを採用しました。
JSのchromadbではデフォルトでall-MiniLM-L6-v2という埋め込みモデルを使用できるため、追加でAPI Keyを取得する必要がないからです。(OpenAIのAPI Keyを使うこともできますが、今回はとにかく手軽に使ってもらいたいのでサポートしません。)

VSCodeの拡張機能

VSCodeの拡張機能は作成したことがありませんでしたが、ドキュメントが充実しているので問題なさそうです。
https://code.visualstudio.com/api/get-started/your-first-extension

開発 🚀

GitHub Copilotの力を借りながら1日ちょっとで作成・公開できました。

https://github.com/k1e1n04/dev-insights

苦労したのはバンドル化のところ。
chromaが依存しているchromadb-default-embedawait importしておりesbuildでCommonJSとしてうまくバンドル化できず。
かといって1GB以上の拡張機能なんてインストールしてもらえません。
仕方がないので自前でesbuildのプラグインを作成しrequire.resolveでパスを解決してからawait importするようにしました。(本当に苦肉の策なのでいい方法があれば教えてください。)

import fs from "fs";

export const replaceChromadbPlugin = {
  name: "replace-chromadb-plugin",
  setup(build) {
    build.onLoad({ filter: /chromadb\.mjs$/ }, async (args) => {
      let source = await fs.promises.readFile(args.path, "utf8");
      const original = source;

      const originalCode = `const { pipeline } = await import("chromadb-default-embed");`;
      const replacementCode = `
        const path = require.resolve("chromadb-default-embed");
        const { pipeline } = await import(path);
      `;

      source = source.replace(originalCode, replacementCode);

      if (original === source) {
        new Error("Replacement failed");
      } else {
        console.log("Replacement made");
      }

      return {
        contents: source,
        loader: "js",
      };
    });
  },
};

こだわったこと 🎯

エディタ上で使えること

開発をしながらブラウザや他の画面に切り替えるのはユーザー体験が悪いため、VSCodeで使えることにこだわりました。

商用利用のハードルを低くすること

商用利用のハードルを低くするため以下を意識しました。

  • Copilot以外はローカルで完結:データが外部に送信されないため安心
  • 生成物の権利を明記:利用者が生成した成果物の権利を持てる
  • オープンソース (Apache-2.0ライセンス):自由にフォーク・社内配布が可能

今後の追加開発予定 🛠️

近々VSCodeの設定で取り込み対象のパスを事前に設定しておき、/syncというコマンドで同期できる機能を追加する予定です。

最後に 🙌

この拡張機能が、新しい環境に飛び込んだばかりで情報収集に悩んでいる人の役に立てば嬉しいです。
コントリビュートやFBもお待ちしています。

https://marketplace.visualstudio.com/items?itemName=KenIshii.devinsights&ssr=false#overview

Discussion