1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

StylezAdvent Calendar 2024

Day 2

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

Last updated at Posted at 2024-12-01

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

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

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

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

image.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

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

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

image.png

Qwen2.5 Coderをクリックします。
image.png

パラメーターを調整します。
image.png

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

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

image.png

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

3. Continueをインストール

「Quick start」画面
image.png

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

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

「Best」画面
image.png

「Local」画面
image.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

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

「Provider」をクリックして「LM Studio」を選択します。
image.png

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

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

image.png

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

4. 使ってみる

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

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

GPUが動いて、
image.png
コードが生成されました。

image.png

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

SignUpsも追加してみます。

特定のコードを選んで、Ctrl+I
image.png

image.png

SignUpも追加されました。

5. まとめ

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

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?