如何在Visual Studio Code中配置LM Studio寫程式碼

如何在Visual Studio Code中配置LM Studio寫程式碼

在之前的文章中,我們介紹了幾款內建人工智慧功能的程式碼編輯器。不過,這些功能通常依賴於雲連線,可能需要訂閱才能使用所有功能。如果你是離線工作,或者發現訂閱費用超過了其好處,這可能會造成不便。

如果你正在尋找一個免費的離線替代方案,LM Studio 是一個不錯的選擇。這款桌面應用程式允許您直接在電腦上執行功能強大的大型語言模型(LLM)。您甚至可以從Ollama 平臺提供的各種模型中進行選擇。

在本文中,我們將介紹如何將 LM Studio 與 Visual Studio Code (VS Code) 結合使用,以便在程式碼編輯器中獲得 AI 輔助。我們將介紹如何設定、連線到 VS Code 以及使用 AI 輔助功能。

準備工作

首先,請確保您準備好了一些東西:

設定LM Studio

首先,開啟 LM Studio 並下載要使用的 LLM。

對於編碼輔助,最好選擇專門針對程式碼訓練的模型。在本例中,我們將使用擁有 140 億個引數的“Qwen2.5 Coder”模型。

設定LM Studio

不過,選擇一個能在電腦上流暢執行的模型也很重要。如果 14B 引數模型太重,可以嘗試 3B 引數版本。

下載 LLM 後,將其載入 LM Studio 並啟動伺服器。您可以在側邊欄的“Developers”面板中找到伺服器控制元件,如下圖所示。伺服器應該在 http://localhost:1234 開始執行,你會看到列出的可用端點。

列出的可用端點

將LM Studio連線到VS Code

為了在 VS Code 中利用 LM Studio 的人工智慧功能,我們將安裝開源擴充套件 Continue.dev 。該擴充套件專門用於人工智慧程式碼輔助,因此非常適合我們的需求。

安裝完成後,你會看到 VS 程式碼側邊欄出現一個新標籤。這就是“Continue”選項卡。

將LM Studio連線到VS Code

在該選項卡中,我們可以找到“Chat”欄位,在這裡您可以與 AI 助手進行互動。

與 AI 助手進行互動

雖然聊天欄位似乎可以使用,但它還不能工作或響應您的查詢。我們需要為聊天選擇 LLM 模型。要啟用它,請單擊欄位底部的 Model 選項,然後選擇 + Add Chat model

為聊天選擇 LLM 模型

選擇“LLM Studio”作為 Provider“Autodetect”作為 Model

新增聊天提供商

連線後,聊天欄將顯示 LM Studio 中可用的 LLM 模型。在本例中,我們將選擇在 LM Studio 中下載並設定的“Qwen2.5 Coder with 14B”模型。

下載並設定的“Qwen2.5 Coder with 14B”模型

使用聊天欄

聊天欄的工作原理與其他 AI 助手類似。您可以通過提問、請求建議甚至生成程式碼片段等方式與它互動。下面是一些示例:

詢問一個簡單的 HTML 文件片段:

HTML 文件片段

使用 @ 符號並選擇“Files”來提供上下文。例如,附加當前檔案以生成特定元件的 docblock。

生成特定元件的 docblock

配置程式碼自動補全

程式碼自動補全AI 程式碼編輯器中最常見的功能之一。在本例中,Continue.dev + VS Code 設定可能尚未啟用。要啟用它,請開啟 ~/.continue/config.json 中的配置檔案,並新增以下內容,以便將自動完成功能連線到 LM Studio。

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
{
"tabAutocompleteModel": {
"apiBase": "http://localhost:1234/v1/",
"title": "Qwen2.5-Coder 14B",
"provider": "lmstudio",
"model": "qwen2.5-coder:14b"
}
}
{ "tabAutocompleteModel": { "apiBase": "http://localhost:1234/v1/", "title": "Qwen2.5-Coder 14B", "provider": "lmstudio", "model": "qwen2.5-coder:14b" } }
{
"tabAutocompleteModel": {
"apiBase": "http://localhost:1234/v1/",
"title": "Qwen2.5-Coder 14B",
"provider": "lmstudio",
"model": "qwen2.5-coder:14b"
}
}

設定完成並儲存後,您就可以在 VS 程式碼編輯器中看到程式碼自動補全功能。

程式碼自動補全

小結

這就是如何在 Visual Studio Code 中使用 LM Studio 進行人工智慧輔助。這是一種在程式碼編輯器中使用人工智慧輔助的好方法,無需依賴雲。它也是免費的,你可以選擇最適合你電腦的模型。它是 OpenAI 或 GitHub Copilot 等雲服務的最佳替代品。

試試吧,看看它能如何幫助你完成編碼任務。

評論留言