MCP 客戶端建置與設定教學

MCP 客戶端建置與設定教學

我們將說明如何建置與設定 MCP 客戶端,特別聚焦於 RooCode 工具與本地模型的整合,以及實際的應用

我們將說明如何建置與設定 MCP 客戶端,特別聚焦於 RooCode 工具與本地模型的整合,以及實際的應用。

1. 安裝與設定 Roo code

roo code 是一款支援本地 AI 助手的 VS Code 擴充套件。安裝步驟如下:

  1. 前往 Visual Studio Marketplace 或Extensions 搜尋「Roo code」並點擊安裝。
  2. 安裝後,Roo code 圖示會出現在 VS Code 側邊欄。

2. 本地模型支援

Roo code 支援多種本地模型,包括 Ollama、LM Studio 等。這些工具可讓你在本地運行大型語言模型(LLM),並與 MCP 協議整合。

  • Ollama:開源工具,輕鬆在本地運行 LLM。
  • LM Studio:圖形化介面,方便管理本地模型。

2.1 如何安裝ollama

  1. 先去下載最新版ollama https://ollama.com/download
  2. 選擇你的作業系統
  3. 安裝ollama
  4. 安裝好之後下載你想要用的模型,https://ollama.com/search
    我這邊使用gemma3n e4b試試看

實際模型的選擇要根據你的電腦性能來選擇,如果像是你想使用nvidia geforce GTX 1080跑原生的deepseek r1,就會象是把大象塞進冰箱一樣

  1. 安裝模型
ollama run gemma3n:e4b
  1. 成功的結果就會像下圖

2.2 設定本地模型(後續都以Ollama爲例)

這個時候你進去Roo code的時候應該就可以看到你剛才下載的模型了,如果沒有,就重啓VSCode。

3. MCP 工具協議運作方式

MCP 工具讓模型能夠與外部世界互動。其運作流程如下:

flowchart TD A[代理人(Agent)模式下,所有可用工具會隨 user 請求一同傳送給模型] --> B[模型可選擇在回應中呼叫工具] B --> C[若工具政策為「自動」,則略過用戶確認步驟] C --> D[RooCode 會自動呼叫內建功能或 MCP 伺服器提供的工具] D --> E[工具執行結果回傳給模型] E --> F[模型可再次發起工具呼叫,進行多輪互動]

4. 整合 MCP 伺服器

若要將現有 MCP 伺服器整合進 Roocode,請依下列步驟:

  1. 點擊圖片上方 MCP圖標
  2. Add MCP Servers,點擊Edit Global MCP
  3. 將下方程式碼貼入
{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "@playwright/mcp@latest"
      ]
    }
  }
}

重新刷新頁面

4.之後應該在MCP Server上面可以看到有出現一個PlayWright的選項,并且亮綠燈

5. 實際應用範例

假設你已設定好 MCP 伺服器與本地模型,將模式選擇成Code之後,就可以嘗試以下自動化任務:

  1. 使用 playwright 瀏覽 https://news.ycombinator.com
  2. 擷取首頁前 4 筆貼文的標題與網址。
  3. 在專案根目錄建立 hn.txt 檔案。
  4. 將標題與網址以「標題 - 網址」格式逐行寫入檔案。

執行後,會在目錄下自動產生 hn.txt,內容即為擷取結果。

使用本地模型運行有問題時,可以先使用google gemini的免費模型,只要到 https://aistudio.google.com/apikey 創建一個免費的API key,就可以使用gemini 2.5 flash 模型

6. 結論

透過 Roocode 結合本地模型與 MCP 伺服器,你可以打造完全本地化、資料私有且功能強大的 AI 助手開發流程。建議多嘗試不同 MCP 伺服器,探索更多自動化與 AI 工具的可能性!