vibe coding 一个多月,我把 Claude Code + Pi 做成了桌面 IDE,还给它移植了 VS Code 的编辑体验

先说清楚:这不是广告,是我自己项目的一篇记录文。

我用了一个多月的时间,用 vibe coding 的方式,从零肝出了一个叫 Mcode 的桌面应用。它把 Claude CodePi 这类 agent 平台,放进了一个完整的桌面 IDE 里------会话管理、实时流式输出、工具审批、计划模式、内置浏览器、文件树、Git、终端,全都打包进一个窗口。

但在这些"主流功能"之外,我在这一个月里偷偷做了不少体验向的优化 。这篇就专门聊聊其中我最舍不得拿出来讲的一块:编辑器

底子选对了:Monaco,VS Code 同源

做编辑器,我没有从零造轮子,直接选了 Monaco Editor------就是 Visual Studio Code 内部在用的那个编辑引擎。所以从第一行代码开始,它就有 VS Code 那种手感:语法高亮、代码折叠、多光标、智能提示、Command Palette......这些天生自带。

但光有同源引擎还不够,真正爽的编辑体验,靠的是我把 VS Code 的"使用习惯"移植了过来。下面这几个,是我最想安利的。

移植 1:Ctrl+F12,直达实现

写代码读代码最烦的就是追语义:看到一个方法调用,想知道它到底干了啥,得一层层往下点。VS Code 里的 Ctrl+F12(转到实现)特别好用,我就把它做进了 Mcode。

基于语言服务器(LSP)能力,在编辑器里按 Ctrl+F12,光标停在哪个方法上,就直接跳到它的实现位置------跨文件跳转也能用,自动在对应文件、对应行打开。读别人代码(或者说,读 AI 刚写的代码)时特别省事。

移植 2:Alt+← / Alt+→,跳来跳去不怕迷路

这是我觉得最值的一个。VS Code 老用户应该都懂 Alt+←(后退)、Alt+→(前进)的好------尤其当我们频繁"转到定义/实现"去追代码,再按一下就能跳回来。

我把这套编辑导航历史 完整做了出来:每次跳转(转定义、转实现、从文件树打开、从对话里点开某个文件)都会记住你原来在哪个文件哪一行 ,按 Alt+← 一步步退回去,Alt+→ 再前进。读文件读得再深,也不会找不到来时的路。

移植 3:打开文件,记住你上次停在哪

这个细节小,但每天都用得上:重新打开一个文件,自动回到你上次停留的滚动位置和光标处

不像很多工具每次打开都从文件顶部开始,逼着你重新滚一遍。Mcode 会默默记住每个文件的阅读位置,下次打开直接续上------这个对"每天读大量文件跟踪状态"的人太友好了。

顺手也提一句其他编辑相关的手感

  • Ctrl+S / Cmd+S 保存,走完整保存 + 诊断流程;
  • 配合语言服务器,还有跨文件跳转定义、查引用、悬停看提示、诊断波浪线
  • Monaco 自带的多光标、代码折叠这些,开箱即用。

总之,就是让你觉得"这编辑器跟 VS Code 一样顺手"。

为什么"读代码"这么重要

做 Mcode 这一年多我最大的体会是:AI 写代码的能力已经很强,但人最终要"读懂"这些代码,才能信任它、review 它、接手它。所以我把编辑器的功夫主要花在"阅读体验"上------跳转、导航历史、记住位置,全是为了让你在一堆文件里进出自如、心里有数。

项目信息

  • 名称:Mcode(免费、开源、MIT)
  • 技术:Electron + React 19 + Monaco + Claude Agent SDK + Pi Coding Agent SDK
  • 一句话:不重新实现 agent,只做完整、顺手的桌面交互界面
  • 🔗 GitHub:github.com/huangbh2020...

如果你也受够了在终端里裸跑 agent、又想有个熟悉顺手的编辑器,欢迎 Star 支持,或者直接提 issue 告诉我你最想要哪个功能。这一个月的心血,希望能帮到你。

相关推荐
qq21084629531 小时前
在python中什么是 self 和 cls?
开发语言·前端·python
我是谁的程序员1 小时前
Windows / Linux / Mac 上不用 Xcode 把 IPA 上传到 App Store,upload 命令详解
后端·ios
kyson_1 小时前
前端性能优化全链路实践指南:从网络、缓存到渲染与监测
前端
前端fighter1 小时前
线上崩溃?使用 TRAE Work 5分钟把混淆日志翻译成人话并输出复盘报告
前端·vue.js·程序员
凌涘1 小时前
JWT 登录鉴权 Demo 拆解
后端
网安蟹佬霸1 小时前
CTF Web方向解题全攻略:从信息收集到getshell(附实战payload与脚本)
android·前端·网络·安全·web安全·网络安全·网安
JimmtButler1 小时前
从 Java 到 JS:我终于把闭包想明白了
javascript·后端
前端玩坑坑1 小时前
CSS Container Queries 容器查询入门教程
前端
带多刺的玫瑰1 小时前
Leecode#4刷题之寻找两个正序数组的中位数
java·前端·算法