Vibe Coding 入门

Windows 配置

系统基础安装

原生安装(基于 winget):

winget --version # 查看版本/确定 winget 可用性
winget install OpenJS.NodeJS.LTS # 安装 Node.js
node -v # node 版本记录,v24.13.1
npm -v # npm 版本记录

winget install Git.Git # 安装 Git
git --version

winget install Microsoft.VisualStudioCode # 安装 VS Code

# 三套常用的 CLI
npm install -g @anthropic-ai/claude-code
claude --version # 2.1.55

npm install -g @google/gemini-cli
npm install -g @openai/codex

npm -v 出现此系统上禁止运行脚本,可通过管理员身份执行策略调整安全策略以规避此问题:Set-ExecutionPolicy RemoteSigned

CC-Switch 网关

CC-Switch 安装:Release 地址

CC-Switch 配置:

VSCode 配置

VSCode 插件安装:

  • Codex – OpenAI’s coding agent
  • Claude Code for VS Code

ClaudeCode

ClaudeCode 基本介绍

ClaudeCode 经验总结

ClaudeCode 源码解读

Codex

Codex 经验总结

Skill 推荐

(1)superpowers 231k ⭐️

  • 围绕软件开发基础方法论打造的自动工程化工作流
  • 覆盖头脑风暴、设计开发、分工执行、测试审核等流程
  • 多个 skills 间形成工作闭环,同时在合适时机自动触发
  • 实测安装后,能显著改善编程性能,提高代码规范性

(2)gstack 111k ⭐️

  • 建立一套“角色驱动”的AI 工程组织,将协作流程外显
  • 包含 CEO、设计师、工程经理、审核/发布者等角色
  • 目的和superpowers 类似,但更偏组织和决策分工

(3)OpenSpec 55k ⭐️

  • 通过轻量的规范(spec)机制,来进行需求对齐和开发约束
  • 能够有效改善代码质量,方便团队间的需求对齐和版本追踪

(4)Agent-Reach 34k ⭐️

  • 增加 Agent 的互联网搜索能力,覆盖主流平台
  • 如 Twitter, Reddit, YouTube, GitHub, Bilibili,小红书
  • 注意:部分平台连接需要配置 cookie 或科学上网

其他:节省 Token 的 Skills

经验总结

模型鉴真

复杂数据集测试,比如τ-Bench

简单降智测试,比如糖果数学题

手机/网页端

目前官方支持不太好,因此调研了几个比较有用的第三方软件

  • happy 22.4k⭐️:支持 claude/codex,终端层截流,多端切换需重启会话;缺点是接管会话,与原生 ai cli 不互通
  • Cloud CLI 10k⭐️:支持 claude/codex/cusor,有桌面端和移动端,缺点和 happy 一样,与原生 ai cli 不互通
  • hapi 4.4k ⭐️:类似于 happy,只不过 hapi 是去中心化的,数据存储在本地,而 happy 是集中式加密存储
  • OpenChamber 6.1k ⭐️:针对 OpenCode 增强,支持桌面端/浏览器/手机端
  • Mindfs 1.4k ⭐️: 集成主流编程 Agent,会话共享/灵活切换,支持远程访问(免费)
  • VibeAround 465 ⭐️:集成主流编程 Agent,支持多端的会话共享,内置 API 中转

最终方案:hapi+Cloudflare Named Tunnel

# 登录并创建隧道(命名为 hapi)
cloudflared tunnel login
cloudflared tunnel create hapi

# 配置 DNS 路由,将你的域名指向该隧道
cloudflared tunnel route dns hapi hapi.20110123.xyz

# 运行隧道 --protocol http2 是为了避免长连接超时问题
cloudflared tunnel --protocol http2 run hapi

# 配置和启动 HAPI(linux)
HAPI_PUBLIC_URL="https://hapi.20110123.xyz" hapi hub

# 配置和启动 HAPI(windows)
$env:HAPI_PUBLIC_URL = "https://hapi.20110123.xyz"
hapi hub

参考

ByteCatCode 文档中心

Vibecoding 入门教程(macOS + Windows )

往年同期文章