博客 / 詳情

返回

女友怒罵國內不能用Claude Code,於是我給她做了一個

大家好,我是程序員魚皮。最近女友開始學習 AI 編程了(被我帶的),她聽説 Claude Code 這個 AI 編程工具很牛掰,結果試了下發現得要國外的 Claude 賬號才能登陸。

然後她就罵罵咧咧地跟我吐槽。

展現男友力的時候到了,於是我開玩笑地説:別難過了,要不我給你做一個 Claude Code 算了?

結果,她當真了!

我 ↓

沒辦法,只能試一試了,畢竟誰希望聖誕節這兩天讓自家人難過呢?

正好這兩天國產 AI 大模型 GLM-4.7 發佈了,我看網上很多博主都在吹什麼 “國內最強的編程模型”、“最強的開源模型”、“Claude 的最佳平替”,甚至説是超過了 GPT-5.2 和 Claude Sonnet 4.5。

你説國產最強也就算了,超過 Claude 這我能信麼?

那正好,我就嘗試用 GLM-4.7 來做個自己的 AI 編程工具吧,對標 Claude Code 那種的,看看 GLM-4.7 到底幾斤幾兩。

接下來,就讓我們一起 用 GLM-4.7 + Claude Code 開發一個 基於 GLM-4.7 的仿 Claude Code 的 AI 編程工具。

項目開始前,先起一個響噹噹的名字,就叫 Yupi Code 吧!

接下來,我們將遵循這套《魚皮 AI Vibe Coding 開發仿 Claude Code 的 Yupi Code》流程,不寫一行代碼,一步一步把 “Claude Code” 做出來!

  • 環境準備 => 安裝工具和配置環境,能夠 Vibe Coding

  • 技術調研 => 確認滿足生成需求

  • 設計開發 => 包括方案設計、生成代碼、修復 Bug,得到 MVP 最小可行產品

  • 版本控制 => 防止後續改動出問題

  • 優化能力 => 支持更多對標 Claude Code 的功能,比如聯網搜索、流式輸出、深度思考等

 

環境準備

智譜的 GLM-4.7 兼容多款編碼工具,除 Claude Code 外,還支持 Cursor、Cline 等主流編碼工具,靈活適配多種開發場景。

給 Claude Code 接入 GLM 也很簡單,1 分鐘搞定。

首先打開終端,輸入一行命令安裝 Claude Code:

npm install -g @anthropic-ai/claude-code

 

然後執行 claude 命令打開程序,默認是需要登錄 Claude 賬號的,否則無法使用:

 

不過沒關係,讓我們把它背後的 AI 大模型換成國內的 GLM-4.7。首先進入 {用户目錄}/.claude 目錄,創建一個 settings.json 配置文件:

 

然後修改配置文件中的內容如下,記得替換成你自己的 API Key:

 

API Key 直接到智譜開發平台獲取即可:

指路:https://bigmodel.cn/

 

接下來就可以愉快地使用了~

 

除了這種方式外,官方文檔還提供了更簡單的方式,直接使用自動化助手,按照指引就能完成環境配置:

 

技術調研

如果要完全利用 AI 開發項目,有幾個難點:

  1. 項目需要包含完整前後端,需要大模型有較強的 編碼能力

  2. 需要讓後端項目對接 AI 大模型,每個大模型的接入和開發方式不同,需要讓 AI 讀取文檔 理解最新的開發方式

  3. 如果想要優化界面效果,還需要 圖片理解能力,給 AI 一張圖片就能讓它還原

在正式開發前,我們要確認 GLM-4.7 和 Claude Code 的配合能夠滿足這些能力要求。

根據智譜官方介紹,Claude Code 中內置了智譜專屬的 MCP 工具,不需要開發者自己安裝。包括 搜索和網頁讀取 能力、能夠直接解析截圖/設計稿/報錯圖的 視覺理解能力

讓我們依次測試一下,首先是網頁搜索能力,緊跟時事:

測試網頁讀取能力,讓它來讀取我們編程導航網站的信息:

測試圖片理解能力,我給 AI 傳了一張 “從夯到拉排行榜的背景圖”:

AI 的理解還是很準確的,具體文字也讀取出來了。

OK,幾個能力都滿足要求,下面讓我們進入方案設計和開發階段。

 

設計開發

先創建一個乾淨的項目目錄 yupi-code,打開終端並進入該目錄:

 

然後輸入提示詞:

幫我開發一個類似 Claude Code 的終端 AI 編程工具,能夠使用 GLM-4.7 模型幫用户回答問題和生成代碼

一般來説,整個項目的第一句提示詞是最重要的,如果我要開發一個複雜的商業項目,肯定會好好打磨一下這句提示詞,少説寫個幾百字(之前看過我 AI 程序員技術練兵場項目 的同學應該知道)。

但測試 AI 模型時,我喜歡反其道而行之,站在大多數用户的角度,故意輸入一句簡單的提示詞,看看 AI 能不能引導我來生成滿足需求的項目。

果然,AI 判斷這是一個複雜的項目,想要進入 計劃模式 —— 先明確需求、設計方案再開發。

 

然後我們需要通過選擇來明確需求,並讓 AI 生成方案。

Claude Code 的交互做的還是不錯的,先選擇編程語言,建議老老實實選 AI 推薦的第一個:

 

接下來是選擇項目要具有的功能。如果是以前,我可能會先讓 AI 只開發基礎對話功能,跑通流程後再添加其他功能。

但現在我對 AI 有了更多的信心,咱就把所有功能全都選上,幹就完了!

 

其他設置就不多説了:

 

選擇完成後,AI 給出了詳細的實現計劃,一定要仔細閲讀:

 

你可以直接執行,或者給 AI 進一步的指導。比如我讓 AI 生成的應用去調用智譜 Coding Plan 套餐的 BASE URL,能節約一些成本,並且給 AI 提供了一個官方的 API 文檔,便於 AI 生成準確的代碼。

 

確認後開始執行,AI 會先調用內置的工具來搜索和解析文檔:

 

然後 AI 列出了一個 Todo List,並且一步步生成代碼和文檔:

 

這期間如果你發現有嚴重的問題,比如發現 AI 生成的代碼已經完全偏離預期了,那麼就儘早暫停或者人工輸入提示詞來引導 AI。如果發現 AI 只是有一小塊代碼生成的不對,我的建議是先忍着,反正最後 AI 大概率會自己發現問題並修復。

過了大概十幾分鍾後,AI 生成完成,還告訴了我使用方法:

 

可惜我根本懶得看,我直接把 API Key 交給 AI 幫我運行不就好了?

Vibe Coding 開發模式下,我多自己做一件事,都是對 AI 的不尊重。

輸入提示詞:

我的 API key 是 xxxxxxx,請你幫我運行

 

然後,翻車了。。。

 

不慌,直接讓 AI 自己檢查並修復錯誤。而且為了使用方便,應該提供一個快速啓動腳本,能夠讓我像運行 Claude Code 一樣,一行命令啓動 AI 編程工具。

提示詞:

幫我檢查並修復項目中的錯誤,並創建一個可以像 Claude 一樣讓用户在命令行輸入 "yupicode" 就能啓動程序的快捷腳本

 

幾分鐘後,AI 修復完成,並且提供了一個 yupicode 腳本:

 

我打開一個新的終端,然後運行 yupicode 腳本,嘗試和 AI 對話:

你別説,效果還不錯啊!

還像 Claude Code 一樣提供了一些命令,比如清空對話歷史、查看幫助之類的:

 

看到這裏,我感覺項目已經基本可用了。建議給項目上個 Git 來版本控制,防止後面的改動出問題。

什麼?你不知道 Git 是什麼?

沒關係,直接交給 AI 吧:

現在項目已經基本可用了,幫我提交一個 git 版本,防止後續改動出問題

 

測試下來,目前的 Yupi Code 還有一些不足之處,比如不支持搜索:

接下來就讓我們優化項目,增加更多 Claude Code 支持的能力。

 

優化能力

1)先來添加網絡搜索能力,直接把智譜的官方文檔給它丟進去。提示詞如下:

現在好像不支持網絡搜索,請參考
https://docs.bigmodel.cn/api-reference/%E5%B7%A5%E5%85%B7-api/%E7%BD%91%E7%BB%9C%E6%90%9C%E7%B4%A2
文檔,增加網絡搜索工具調用能力

 

 

很快 AI 就添加了新功能,重新打開 yupicode 來驗證下,正常生效了:

 

2)下面再優化下 AI 回覆的效果,目前是卡一會兒然後直接輸出完整回答,需要調整為流式輸出的打字機效果。

提示詞:

我希望在等待 AI 回覆時,有一個轉圈的小圖標;並且 AI 的回覆可以實時流式輸出

 

AI 很快就搞定了:

 

3)GLM-4.7 進一步強化了交錯式思考能力,引入 保留式思考輪級思考,讓複雜任務執行更穩、更可控。我們也應該讓 Yupi Code 輸出模型的思考信息、工具調用信息等等,幫助用户瞭解情況。

輸入提示詞:

幫我輸出模型思考的信息、以及工具調用信息,你可以通過官方文檔來了解如何開發

 

 

測試一下優化後的效果,比如 “介紹一下魚皮的 AI 導航網站”,能很清晰地看到思考過程:

 

大功告成

到這裏,仿照 Claude Code 開發的 Yupi Code 就已經完成了,讓我們用它來開發個小網站試試。

比如來個動畫學算法的 Demo,提示詞:

幫我開發一個學習冒泡排序算法的動畫網站,使用 Q 版動漫的風格和吉伊卡哇感覺的配色

 

 

效果如圖,畫風還是不錯的,但要是之後大模型能自動生成圖片插畫並添加到網站中,就更好了。

 

再來開發個仿真的電子黑板,提示詞:

幫我開發一個仿真的電子黑板,用户可以在上面畫畫並導出為圖片

 

 

聖誕節了,魚皮給大家畫顆聖誕樹,還附贈一個小禮物,這怎麼能不算是程序員的浪漫呢~

 


 

OK,這就是我 利用國產的 AI 大模型 GLM-4.7 + Claude Code 開發出一個 基於 GLM-4.7 的 Yupi Code 的全過程了。

我自己體驗下來,GLM-4.7 相比於之前的國內大模型,在處理複雜任務的穩定性上有進步,即使遇到問題也會自動修復,讓最終生成的代碼可運行。

而且 GLM-4.7 調用工具的能力也強化了,和 Claude Code 等 AI 編程工具打配合,直接內置了聯網搜索、網頁讀取、解釋圖片等 AI 編程常用的能力,不需要自己再去找 MCP 來增強了。

不得不説,作為一直關注智譜 AI 的忠實開發者,真的很能感受到他們這幾個月來在 AI 編程方向的努力,我相信大家也是有目共睹。

不過畢竟現在的 Yupi Code 是 AI 一把梭的,還有很多能優化完善的地方。如果後面有時間,大家也感興趣的話,説不定我會好好打磨打磨這個工具把它開源出來。我的終極目標是,讓基於 AI 大模型 GLM-4.7 + Claude Code 開發的基於 GLM-4.7 的 Yupi Code 編程工具,能夠開發出一個基於 GLM-4.7 的 編程工具,比如 Yupi Son Code。我認為好的 AI 工具就是要能做到無限套娃,瘋狂自舉!

聽懂掌聲~

 

更多編程學習資源

  • Java前端程序員必做項目實戰教程+畢設網站

  • 程序員免費編程學習交流社區(自學必備)

  • 程序員保姆級求職寫簡歷指南(找工作必備)

  • 程序員免費面試刷題網站工具(找工作必備)

  • 最新Java零基礎入門學習路線 + Java教程

  • 最新Python零基礎入門學習路線 + Python教程

  • 最新前端零基礎入門學習路線 + 前端教程

  • 最新數據結構和算法零基礎入門學習路線 + 算法教程

  • 最新C++零基礎入門學習路線、C++教程

  • 最新數據庫零基礎入門學習路線 + 數據庫教程

  • 最新Redis零基礎入門學習路線 + Redis教程

  • 最新計算機基礎入門學習路線 + 計算機基礎教程

  • 最新小程序入門學習路線 + 小程序開發教程

  • 最新SQL零基礎入門學習路線 + SQL教程

  • 最新Linux零基礎入門學習路線 + Linux教程

  • 最新Git/GitHub零基礎入門學習路線 + Git教程

  • 最新操作系統零基礎入門學習路線 + 操作系統教程

  • 最新計算機網絡零基礎入門學習路線 + 計算機網絡教程

  • 最新設計模式零基礎入門學習路線 + 設計模式教程

  • 最新軟件工程零基礎入門學習路線 + 軟件工程教程

user avatar
0 位用戶收藏了這個故事!

發佈 評論

Some HTML is okay.