LM StudioとVSCodeでローカルAI(ローカルLLM)

毎度、ググっても出てこない小ネタを取り扱っております。
本記事は個人的な見解であり、筆者の所属するいかなる団体にも関係ございません。

# 0. コーディングを楽にするローカルLLMを使いたい

あ、本当にそれだけです。
Cursor Editorも使っていますが、月額費用も掛かるし(満足していますが)、そのうちFineTuningしたモデルも作ってみたいので、ロカールLLMを使ってみたいと思っていました。

そこに、Qwen2.5 Coderが出現したので、アドベントカレンダーネタにちょっとやってみました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15176/8253dcec-6ac6-4ee3-616c-17b091687a49.png)

# 2. LM Studioについて

こちらをご参照ください。
LM studio（ローカルLLM）をVScode上で利用してみた \#VSCode \- Qiita 
https://qiita.com/QA_tonchan/items/68fe5b27ffabb42498b2

LM StudioとVSCodeを組み合わせる記事は幾つかでています。

LM Studioについての記事は以下をご参照ください。

LM Studio でローカル環境でLLMを動かす手順について \#AI \- Qiita 
https://qiita.com/kharada_toyotec/items/d81214234bc429475789

UIがありますし、さほど問題ないかと思います。

最近、LM Studio 0.3.5になってUIが変わったのでモデルのダウンロードのスクリーンショットだけアップしておきます。

まず、LM Studioを起動して「探索(英語ではDiscover)」をクリックするとモデル検索画面が出るので、検索ボックスに「code」と入力します。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15176/a0b10375-20d9-612d-0f13-4f1ab3030a43.png)

必要なモデルをクリックして、右下の「Download」をクリックします。
ダウンロードが完了したら次に行きましょう。

左下の「User」「Power User」「Developer」から「Power User」を選択すると、
「開発者」というのが左に出てきます。クリックして、「読み込むモデルを選択」をクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15176/f1f00f6d-b608-e287-4257-54f44095fa71.png)

Qwen2.5 Coderをクリックします。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15176/6c84f5ae-56e4-1247-5a87-8c35c5709872.png)

パラメーターを調整します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15176/37b18a9c-3e28-341c-c5eb-6273db6e249d.png)

ひとまずデフォルトで様子を見て、メモリー使用量を考えながらコンテキスト長とGPUオフロードを増やしていきましょう。

「モデルを読み込む」をクリックします。
GPUにモデルが読み込まれたら、「Start」をクリックします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15176/443613dd-a707-7a7b-a2b7-951960f9da00.png)

ポート番号は後から使うので覚えておきましょう。


# 3. Continueをインストール


「Quick start」画面
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15176/f27ef638-cc70-20a8-48cd-9d5f400e885c.png)

Continueで使えるAPIキーが取得できるようです。

Continueさんは以下です。
Continue 
https://www.continue.dev/

「Best」画面
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15176/bf06cfd9-1259-a7d2-5605-dc4866a40675.png)

「Local」画面
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15176/2d2183f1-d9b8-d0c0-a884-a3da561011a5.png)

ollamaを使ってローカルLLM APIを作るのがお薦めされています。
今回は、ollamaを使わずにLM Studioを使ってみます。
(WindowsなのでWSL2を使わずに直接API接続できるのがいいですね)

LM studio（ローカルLLM）をVScode上で利用してみた \#VSCode \- Qiita 
https://qiita.com/QA_tonchan/items/68fe5b27ffabb42498b2

こちらの画面はどれも無視して、Claude 3.5 Sonnetをクリックして、

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15176/e4c4b94b-30b8-a7e3-5f73-c4c07a30d1dc.png)

「Add Chat model」をクリックします。

「Provider」をクリックして「LM Studio」を選択します。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15176/1466d658-17a8-b48a-93cf-13d5ceb74415.png)

Modelは、「Autodetect」で大丈夫です。

Autodetectを選択するとLM Studioで過去にダウンロードしたモデルの一覧が表示されるようになります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15176/65bf449d-27dc-6e35-1bea-47d516528559.png)

今動かしているのは、「qwen2.5-coder-32b-instruct」なのでこれを選択します。

# 4. 使ってみる

早速使ってみます。
Spring Bootを使って、ログイン画面を作ってもらいます。Spring Securityも有効にしましょうか。

「プロンプト」：
「Spring Bootを使ったSPAアプリケーションで、ログイン画面を作ってください。Spring Scurityも使ってください。」

GPUが動いて、
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15176/e12b3eda-189c-2222-1c6b-39f5cb35d325.png)
コードが生成されました。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15176/36b442f9-3256-03dd-2dd0-22f641fcd44c.png)

個別のコード修正も可能です。

SignUpsも追加してみます。

特定のコードを選んで、Ctrl+I
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15176/9936632f-e4c3-f0a2-d961-0d9691ad95be.png)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/15176/a4640eaa-d62c-d4bc-63ed-2df80301f440.png)

SignUpも追加されました。

# 5. まとめ

動きは、モソモソっという感じですが、ローカルでちゃんと動くのがいいですね。