從 0 到 1 玩轉Claude code（藍耘UI界面版本）：AI 編程助手的服務器部署與實戰指南

前言

藍耘 Coding UI 作為基于 Claude Code 的可視化工具，憑借對本地項目的深度掌控、與 Git 倉庫的無縫銜接以及直觀的交互界面，正在重構開發者的工作流。本文將帶你一步步完成從環境搭建到實戰使用的全流程，讓這款工具真正成為你的編程「副駕」。

溫馨提示：

博主寫的時候腦子比較混亂，正篇文章的思路應該如此：
先進行node.js和npm的安裝，然后進行claude code的本地配置，最后再進行lanyuncodingui的配置與安裝操作

lanyuncodingui可視化界面目前只支持Mac和Liux環境，目前不支持Windows的，如果你想體驗的話你可以使用虛擬機、云服務器、wsl、mac進行體驗的，我的這篇文章是基于云服務器Ubuntu搭建的，后續會出基于wsl搭建的教程的

安裝 Node.js 和 npm

更新系統包管理器

首先，確保您的系統是最新的。打開終端并運行以下命令：

sudo apt update && sudo apt upgrade -y

image.png
如果你出現下面這種情況的話：軟件包之間存在沖突或某些軟件包沒有被正確安裝導致的。你就得輸入下方命令進行嘗試修復系統中的破損包。運行以下命令來修復

sudo apt --fix-broken install

image.png
然后再次進行管理包的更新image.png

根據系統環境，使用以下命令安裝 Node.js 和 npm。

sudo apt-get install -f
sudo apt-get install nodejs npm

image.png
image.png
你如果出現了下方的報錯說明你在安裝 Node.js 時遇到了一些問題，具體是由于文件沖突導致的。錯誤信息顯示 dpkg: error processing，并且提到 'libnode-dev' 包與 nodejs 包的文件沖突。
image.png
刪除現有的 Node.js 和相關依賴
由于存在包沖突，首先我們需要刪除現有的 Node.js 和 libnode-dev 包。

運行以下命令：

sudo apt-get remove --purge nodejs libnode-dev

清理殘留的包
然后執行以下命令清理所有不再需要的包和依賴：

sudo apt-get autoremove -y
sudo apt-get clean

重新安裝 Node.js
清理完成后，您可以再次嘗試安裝最新版本的 Node.js：

curl -sL https://deb.nodesource.com/setup_20.x | sudo -E bash -
sudo apt-get install -y nodejs

檢查版本
安裝完成后，再次檢查版本，確保 Node.js 已成功安裝：

node -v
npm -v

image.png
輸入命令安裝藍耘 Coding agent

npx lanyuncodingui

但是出現下方報錯命令

報錯顯示

Error: spawn xdg-open ENOENT
...
code: 'ENOENT',
syscall: 'spawn xdg-open',

這表示應用試圖自動用默認瀏覽器打開 http://localhost:3732，但系統中找不到 xdg-open 命令。
輸入下方命令在 Ubuntu 上安裝 xdg-open 所在的軟件包

sudo apt install -y xdg-utils

image.png

藍耘ui界面的配置與安裝

我們輸入命令安裝藍耘 Coding agent

npx lanyuncodingui

image.png

這里可以看到我們成功了，在本地的3876端口開放了界面
他這里讓我們要進行賬戶的創建
image.png
輸入你的姓名，然后重復輸入兩次密碼就能進行賬戶的創建操作了
創建好了賬戶之后我們就進入到了主界面了
image.png
這里我們需要先點擊左上角進行項目文件夾的創建
然后輸入對應的文件路徑就可以進行創建了
我還發現，我這里文件夾創建失敗了，然后本地出現了報錯，有點意思哈，實時監控報錯還是蠻不錯的
image.png
這個報錯說我們服務器上面缺少相關的目錄和配置文件
我們需要針對上面的報錯創建必要的目錄和配置文件：

mkdir -p /root/.claude/projects
touch /root/.claude/project-config.json

初始化配置內容（可選但推薦）：
打開配置文件：

nano /root/.claude/project-config.json

粘貼以下最基本的配置（如果沒有具體要求）：

{"projects": []
}

然后按 Ctrl + O 保存，Ctrl + X 退出。

搞定完成上面的步驟之后我們重新進行項目文件夾的打開
image.png

搞定之后我們本地就可以看到文件夾了
image.png
這個時候我們就可以開始進行對話操作了
image.png
但是我們發了幾句對話消息，沒反應，為什么，因為我們還沒設置api哈哈哈，沒有設置基礎的大模型
image.png

我們打開左下角的Tools Settings進入到設置界面

這里有三個導航欄，第一個導航欄Tools

  • Skip permission prompts：勾選后會跳過權限提示（類似命令行 --dangerously-skip-permissions 標識 ），但需謹慎使用，因為可能讓工具在無確認時執行，存在風險。
  • Allowed Tools（允許的工具）：
    可設置無需權限提示、自動允許使用的工具，比如常見的 Bash(git log:*)（允許執行 git log 相關命令）、Write（寫入操作）等。界面提供快捷添加按鈕，方便快速配置常用工具，若沒配置則顯示 “No allowed tools configured”。
  • Disallowed Tools（禁止的工具）：
    用于設置自動阻止、無需提示的工具，像危險的 Bash(rm:*)（避免誤刪文件的 rm 命令）。沒配置時顯示 “No disallowed tools configured”。
  • MCP Servers：可添加 Model Context Protocol 服務器，為 Claude 這類模型提供額外工具和數據源，沒配置時顯示 “No MCP servers configured” 。

我目前除了里面的MCP其他的都使用不到
第二個導航欄里面的Apperance就是調整當前網頁的外觀的，看你們自己的喜好
image.png
第三個導航欄就很重要了，就是設置我們的kimi -k2模型的api的
image.png
這里我們需要獲取到api-keys
來到藍耘注冊
官網，進入到MaaS平臺
進行api-keys的創建，創建好了之后復制到我們的claude code ui界面
image.png

來到ui界面，點擊Test Connecting進行鏈接測試，這里你如果鏈接成功的話，下方會出現successfully的
image.png
然后我們就可以開始愉快的使用了
但是我們設置好關鍵配置之后一定得點擊右下角的Save Setting進行保存設置
image.png

claude code安裝

[[#1. 安裝 Node.js 和 npm]]這里我們需要先將nodejs和npm環境配置好
終端先輸入命令進行提權，如果不進行提權操作的話是會出現一系列的報錯的

sudo -i

然后輸入命令將claude code安裝到服務器中，這里會檢查我們的nodejs的版本，如果太低了的話是不行的

bash -c "$(curl -fsSL https://raw.githubusercontent.com/LanyunAI-labs/lanyun-cc/main/install.sh)"

image.png
這里我們需要在藍耘官網獲取下api-key，然后粘貼到這里，相當于將信息放到了環境變量里面了，不用我們每次都去官網復制粘貼，這個就減輕了負擔了

然后模型的話我們就默認使用k2了，直接回車就行了

然后我們需要輸入命令進行claude code的激活操作

source /root/.bashrc

然后就可以直接輸入命令進行claude code的使用了

claude

然后他就檢測到了我們之前往環境變量中輸入的api-key的信息，我們這里選擇Yes
image.png
然后他會詢問我們是否信任當前文件夾中的內容，我們選擇Yes，proceed
image.png
然后我們就可以開始愉快的使用了
image.png
這里我們可以在對話框中進行對話操作了哦
image.png

如果你想通過claude code針對一個項目進行操作的話，你得進行初始化操作

/init

image.png
除了初始化還有很多的功能
如果你想退出的話直接ctrl c就行了，退出界面這里會詳細介紹到具體的api耗費情況

并且我們的網頁是可以監控到具體的耗費情況的
image.png

以上都是基于命令行的提問操作的，對于新手小白可能不友好，甚至有時候大佬都覺得挺麻煩的，所以我們藍耘開發了可視化ui界面，[[#藍耘ui界面的配置與安裝]]這里我們已經介紹了如何進行可視化界面的安裝操作
輸入命令啟動下ui界面

npx lanyuncodingui

如果你出現下面的情況
image.png
這種情況通常是主機權限問題，我們可以使用管理員權限進行安裝：sudo npm install -g lanyuncodingui@latest ，執行后稍等片刻，這次我們看到安裝成功了：
image.png
然后輸入命令直接啟動ui界面

lanyuncodingui

這里我們點擊在瀏覽器中打開

輸入信息登錄即可，如果是第一次打開的話會讓你創建用戶的，設置相關密碼信息的
image.png
在可視化界面，可以看到歷史信息
image.png
并且再次打開我們的Settings界面是可以看到我們的api相關的信息是已經被保存好了的，不用二次進行設置了的
image.png
在左側打開終端中的文件夾，然后在這里進行可視化對話，讓ai生成對應的文件，真的很方便。
并且我們也不用打開vscode
我們直接在這個可視化ui界面進行項目代碼的設計，終端界面應有盡有，
image.png
文件可視化全面，偉大無需多言
image.png
并且這里可以和git倉庫進行關聯的，這里我沒有進行關聯，如果必要的話可以進行關聯下的，然后代碼寫好了直接進行提交操作
image.png
藍耘元生代8月福利：新人專享與限量優惠雙加持
🔹新用戶注冊：
20元算力代金券+千萬Token資源包
🔹限量福利：
超值滿減券最高減200
每周登錄領10元算力
充值限時1折禮遇
https://mp.weixin.qq.com/s/mqeC7AIAmBs9BBSeMN4jXQ?scene=1

總結

無論你選擇功能豐富的 lanyuncodingui 圖形化界面，還是高效簡潔的 claude 命令行工具，藍耘 Coding 都為現代開發者提供了一套強大的 AI 輔助解決方案。它不僅能幫你生成代碼、修復錯誤，還能成為你項目開發中最得力的伙伴。

在這個 AI 浪潮席卷而來的時代，擁抱變化、善用工具，是每一位開發者保持核心競爭力的關鍵。現在就動手配置你的藍耘 Coding 環境，親身體驗編程效率的飛躍吧！

https://console.lanyun.net/#/register?promoterCode=0131

本文來自互聯網用戶投稿，該文觀點僅代表作者本人，不代表本站立場。本站僅提供信息存儲空間服務，不擁有所有權，不承擔相關法律責任。
如若轉載，請注明出處：http://www.pswp.cn/pingmian/93156.shtml
繁體地址，請注明出處：http://hk.pswp.cn/pingmian/93156.shtml
英文地址，請注明出處：http://en.pswp.cn/pingmian/93156.shtml

如若內容造成侵權/違法違規/事實不符，請聯系多彩編程網進行投訴反饋email:809451989@qq.com，一經查實，立即刪除！

相關文章

docker使用指定的MAC地址啟動podman使用指定的MAC地址啟動

docker使用指定的MAC地址啟動podman使用指定的MAC地址啟動

docker指定固定的mac地址 1】創建自定義橋接網絡并配置 MAC 地址保留 docker network create --driver bridge custom_bridge2】啟動容器并指定使用自定義網絡 docker run -it --name your-container --network custom_bridge --mac-address 02:42:ac:11:00:02 your-image--mac…
閱讀更多...
抽獎程序web程序

抽獎程序web程序

使用html實現抽獎程序&#xff0c;沒有后臺&#xff0c;如果需要后續寫個后臺可以配置&#xff0c;沒有過多的介紹&#xff0c;看代碼吧 <!DOCTYPE html> <html lang"zh"> <head><meta charset"UTF-8"><title>婚禮抽獎</…
閱讀更多...
【Python辦公】Excel轉json(極速版)-可自定義累加字段（如有重復KEY）

【Python辦公】Excel轉json(極速版)-可自定義累加字段（如有重復KEY）

目錄 專欄導讀 ?? 亮點特性 ?? 安裝與運行 ??? 界面與區域說明 ?? 使用示例 ?? 使用建議 ? 常見問題（FAQ） ?? 技術要點 完整代碼 ?? 結語 專欄導讀 ?? 歡迎來到Python辦公自動化專欄—Python處理辦公問題，解放您的雙手 ?????? 博客主頁：請點擊——…
閱讀更多...
JavaScript 防抖（Debounce）與節流（Throttle）

JavaScript 防抖（Debounce）與節流（Throttle）

在 JavaScript 前端開發中&#xff0c;處理高頻率事件&#xff08;如窗口調整、輸入框輸入、頁面滾動&#xff09;時&#xff0c;如果不加以控制&#xff0c;會導致性能問題&#xff0c;如頁面卡頓或資源浪費。防抖&#xff08;Debounce&#xff09;和節流&#xff08;Throttle…
閱讀更多...
探索無人機圖傳技術：創新視野與無限可能

探索無人機圖傳技術：創新視野與無限可能

近年來&#xff0c;無人機技術的飛速發展不僅改變了航空行業的格局&#xff0c;還深刻影響了多個領域的日常運作。無人機圖傳技術作為無人機的核心技術之一&#xff0c;憑借其精準的圖像傳輸能力和高效的遠程操作特性&#xff0c;正在成為各行各業的得力助手。從空中拍攝到實時…
閱讀更多...
Comfyui進入python虛擬環境

Comfyui進入python虛擬環境

如果你的 Python 可執行文件&#xff08;python.exe&#xff09;位于 C:\comfyui\.venv\Scripts&#xff0c;那么 .venv 本身已經是一個虛擬環境&#xff0c;你只需要 激活它&#xff0c;而無需再創建一個新的虛擬環境。如何激活這個已有的虛擬環境&#xff1f; 1. 打開終端&am…
閱讀更多...
秋招春招實習百度筆試百度管培生筆試題庫百度非技術崗筆試｜筆試解析和攻略｜題庫分享

秋招春招實習百度筆試百度管培生筆試題庫百度非技術崗筆試｜筆試解析和攻略｜題庫分享

筆試介紹 百度非技術崗筆試采用的是規定時間統一筆試形式&#xff0c;管培生會有兩場考試分別是7月底和8月中旬&#xff0c;其他非技術類崗位一般在8月中旬開始。 行測題必考&#xff0c;有些崗位考簡答題&#xff0c;比如管培生以及產品經理等崗位。 筆試內容 筆試內容一…
閱讀更多...
低資源語言翻譯：數據增強與跨語言遷移學習策略

低資源語言翻譯：數據增強與跨語言遷移學習策略

文章目錄一、低資源語言翻譯的挑戰1.1 數據稀缺性1.2 語言特性復雜1.3 評估困難二、數據增強策略&#xff08;Data Augmentation&#xff09;2.1 基于單語數據的增強2.2 基于平行數據的增強2.3 多模態數據增強三、跨語言遷移學習策略&#xff08;Cross-Lingual Transfer Learni…
閱讀更多...
【每天一個知識點】時間序列聚類

【每天一個知識點】時間序列聚類

一、什么是時間序列聚類&#xff1f;如果把數據比作一本書&#xff0c;那么時間序列&#xff08;Time Series&#xff09;就是一本按時間順序記錄事件的日記。它可能是股票每天的價格波動、某臺機器的溫度曲線、一個城市的空氣質量變化&#xff0c;甚至是人的心電信號。時間序列…
閱讀更多...
對抗損失（GAN）【生成器+判斷器】

對抗損失（GAN）【生成器+判斷器】

這個是啥呢&#xff0c;搞圖片生成用的。我搜了下&#xff0c;把整體流程記錄下&#xff0c;過程中會用到GAN準備數據集&#xff08;真實圖像素材&#xff09; 目標生成人臉的&#xff0c;你像游戲注冊時選一個臉。捏臉。那么準備真實人臉圖片老規矩&#xff0c;縮放裁剪…
閱讀更多...
5分鐘入門C++

5分鐘入門C++

這是5分鐘入門 C 的精簡 Demo&#xff0c;盡量涵蓋核心概念&#xff1a;變量、函數、類、控制流、STL 容器&#xff0c;讓你快速理解 C 的基本用法。#include <iostream> // 輸入輸出 #include <vector> // 動態數組 #include <algorithm> // 常用算法…
閱讀更多...
java注釋功能

java注釋功能

為了優化代碼的使用&#xff0c;分享記錄相關注釋功能。 單行注釋 // 這是單行注釋文字多行注釋 /* 這是多行注釋文字 這是多行注釋文字 注意&#xff1a;多行注釋不能嵌套使用。 */文檔注釋 /**- 這是文檔注釋文字- */注釋的作用 描述類或方法的功能&#xff0c;方便別人和自…
閱讀更多...
（論文速讀）DiffusionDet - 擴散模型在目標檢測中的開創性應用

（論文速讀）DiffusionDet - 擴散模型在目標檢測中的開創性應用

論文題目&#xff1a;DiffusionDet: Diffusion Model for Object Detection&#xff08;DiffusionDet:物體檢測的擴散模型&#xff09;會議&#xff1a;ICCV2023摘要&#xff1a;我們提出了DiffusionDet&#xff0c;這是一個新的框架&#xff0c;它將物體檢測描述為從噪聲盒到目…
閱讀更多...
LangChain簡介

LangChain簡介

LangChain 是一個用于構建基于大語言模型&#xff08;LLM&#xff09;的應用程序的開源框架&#xff0c;它提供了一套工具、組件和接口&#xff0c; 可以將 LLM 模型、向量數據庫、交互層 Prompt、外部知識、外部工具整合到一起&#xff0c;進而可以自由構建 LLM 應用。 LangCh…
閱讀更多...
為什么哈希表（字典）的查詢速度有時會突然變慢

為什么哈希表（字典）的查詢速度有時會突然變慢

哈希表&#xff08;在許多語言中被稱為“字典”或“關聯數組”&#xff09;的查詢速度&#xff0c;在理想情況下&#xff0c;應是接近“瞬時”的常數時間&#xff0c;然而&#xff0c;在特定場景下&#xff0c;其性能之所以會突然、無征兆地變慢&#xff0c;其根源&#xff0c;…
閱讀更多...
whisper 語種檢測學習筆記

whisper 語種檢測學習筆記

目錄 transformers推理&#xff1a; transformers 源代碼 網上的語種檢測調用例子&#xff1a; 語種檢測 api transformers推理&#xff1a; https://github.com/openai/whisper/blob/c0d2f624c09dc18e709e37c2ad90c039a4eb72a2/whisper/decoding.py waveform, sample_rat…
閱讀更多...
第1節 從函數到神經網絡：AI思路的逆襲之路

第1節 從函數到神經網絡：AI思路的逆襲之路

&#x1f914; 開篇靈魂拷問 是不是覺得AI知識體系龐大到嚇人&#xff1f;看了一堆快餐視頻還是云里霧里&#xff1f;別慌&#xff01;這個系列就是要幫你打通任督二脈&#xff0c;用"既快又慢、既深入又膚淺、既有趣又嚴肅"的方式講透AI基礎知識&#xff01; &…
閱讀更多...
【科研繪圖系列】R語言繪制多種餅圖

【科研繪圖系列】R語言繪制多種餅圖

文章目錄 介紹 加載R包 數據下載 導入數據 數據預處理 畫圖1 畫圖2 畫圖3 畫圖4 畫圖5 畫圖6 系統信息 參考 介紹 【科研繪圖系列】R語言繪制多種餅圖 加載R包 rm(list = ls()) library(ggstatsplot) library(ggplot2) library(plotrix) library(ggpubr
閱讀更多...
vue3權限樹封裝成組件

vue3權限樹封裝成組件

vue3權限樹組件 功能&#xff1a; 1、勾選節點、自動把父節點勾選。 2、取消勾選、子節點全部取消勾選。檢查父節點&#xff0c;如果只有這個子節點、遍歷把父節點取消勾選 3、filter過濾不僅展示父節點、相關子節點同時展示 4、 高亮顯示所有過濾數據 效果圖父組件引用 <te…
閱讀更多...
銓林接紙機學習記錄1

銓林接紙機學習記錄1

光電開關學習做保養也是檢查這些東西&#xff0c;包括氣路有沒漏氣&#xff0c;固定件松動、軌道清潔之內刀座暫停光電I23刀座行程磁性開關&#xff0c;這個是安全警戒光電&#xff0c;驅動側發射信號&#xff0c;操作側接收刀座暫停光電正常運行是空白的&#xff0c;當出現遮擋…
閱讀更多...
最新文章

Copyright @ 2022~2023