首页 › Vibe coding 项目实战专栏 › VibeCoding全栈零基础教程(附开源和提示词) › 进阶篇 › 第一章:环境搭建与代码运行基础 › 1.0 快速开始

1.0 快速开始

​

阅读完本节后,你将会收获:​

•

配置 pnpm 包管理器和国内镜像源,加速下载​

•

配置 GLM 模型,开始 AI 编程​

​

​

​

Windows 用户​

安装 Git​

​

飞书文档 - 图片

​

下载后双击安装,一直点"下一步"即可(已安装可跳过)。​

安装 Node.js​

​

飞书文档 - 图片

​

下载后双击安装,一直点"下一步"即可(已安装可跳过)。​

验证安装​

按 Win + X,选择 终端(管理员) 或 Windows PowerShell,执行:​

​

代码块​

Plain Text

git --versionnode -v​

​

如果显示版本号,说明安装成功。​

​

飞书文档 - 图片

​

如果提示「无法识别命令」,关闭终端重新打开后再试,如果仍不行则重启电脑。​

配置国内镜像源并安装 pnpm​

在 PowerShell 中执行:​

​

代码块​

Plain Text

npm config set registry https://registry.npmmirror.com/; npm install -g pnpm; pnpm setup; pnpm config set registry https://registry.npmmirror.com/​

​

​

飞书文档 - 图片

​

PowerShell 执行策略错误?​

如果在 PowerShell 中运行命令时出现"无法加载脚本,因为在此系统上禁止运行脚本"错误,请以管理员身份运行 PowerShell,然后执行:​

​

代码块​

Plain Text

Set-ExecutionPolicy RemoteSigned -Scope CurrentUser​

​

然后重新运行上面的命令即可。​

​

​

安装 Claude Code​

在 PowerShell 中执行:​

​

代码块​

Plain Text

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

​

安装完成后,执行:​

​

代码块​

Plain Text

claude​

​

如果看到 Claude Code 的欢迎界面,说明安装成功!​

​

​

如果提示「No suitable shell found」​

这是 Git 没有正确安装。请设置环境变量:​

按 Win + S 搜索"环境变量"​

​

​

点击"编辑系统环境变量"​

点击"环境变量"​

​

​

在"系统变量"中点击"新建"​

变量名:CLAUDE_CODE_GIT_BASH_PATH​

变量值:C:\Program Files\Git\bin\bash.exe​

​

​

确定保存,重启 PowerShell 后再试​

如果仍无效,卸载 Git 重新安装。​

​

​

Mac/Linux 用户​

安装 Git​

macOS:​

•

首次在终端输入 git 会提示安装 Xcode 命令行工具,点击安装即可​

•

或主动执行:xcode-select --install​

•

如需最新版本,可用 Homebrew:brew install git​

Linux:​

​

代码块​

Plain Text

# Ubuntu/Debiansudo apt update && sudo apt install git -y# CentOS/RHELsudo yum install git -y​

​

打开终端​

•

Mac:按 Cmd + Space,输入 "Terminal"​

•

Linux:按 Ctrl + Alt + T​

执行环境初始化脚本​

此脚本将自动安装 Node.js、pnpm,并配置国内镜像源:​

macOS:​

​

代码块​

Plain Text

curl -fsSL https://cnb.cool/vibevibe/scripts/-/git/raw/main/init-node-mac.sh | sed 's/\r$//' | sh && npm install -g pnpm && pnpm config set registry https://registry.npmmirror.com/ && pnpm setup​

​

Linux:​

​

代码块​

Plain Text

curl -fsSL https://cnb.cool/vibevibe/scripts/-/git/raw/main/init-node-linux.sh | sed 's/\r$//' | sh​

​

脚本执行完成后,请重新打开终端窗口(或执行 source ~/.bashrc / source ~/.zshrc)使配置生效。​

这个脚本会自动完成以下配置:nvm(Node 版本管理器,用于切换 Node.js 版本)、Node.js(JavaScript 运行环境,用于执行 TypeScript 代码)、pnpm(包管理器,比 npm 更快更省空间),以及国内镜像源(配置淘宝镜像,加速依赖下载)。​

验证安装​

​

代码块​

Plain Text

git --versionnode -v​

​

如果显示版本号,说明安装成功。​

安装 Claude Code​

​

代码块​

Plain Text

​

安装完成后,执行:​

​

代码块​

Plain Text

claude​

​

如果看到 Claude Code 的欢迎界面,说明安装成功!​

​

​

配置 GLM 模型​

Claude Code 默认使用 Claude 官方模型,但你可以配置国内模型(如 GLM),更便宜且访问快。​

步骤 1:获取 API Key​

访问 智谱开放平台,点击右上角的「注册/登录」按钮,按照提示完成账号注册流程。登录后,在个人中心页面,点击 API Keys,创建一个新的 API Key。​

​

​

​

​

步骤 2:一键安装小助手-自动配置​

在终端/PowerShell 中执行:​

​

代码块​

Plain Text

npx @z_ai/coding-helper​

​

​

飞书文档 - 图片

​

输入获取到的 API Key,工具会自动完成所有配置。​

步骤 3:验证配置​

​

代码块​

Plain Text

​

现在 Claude Code 会使用 GLM 模型回答你的问题。​

官方文档​

更多配置详情可参考 GLM 官方文档 - Claude Code 配置指南。​

需要管理多个模型供应商?​

如果你需要频繁切换不同的 AI 模型供应商(如 GLM、DeepSeek、OpenAI 等),可以使用 cc-switch——一个支持 Claude Code、Codex 和 Gemini CLI 的桌面 GUI 配置管理工具,可一键切换 API 配置、统一管理 MCP 服务器和 Skills,并支持速度测试和系统托盘快速切换。​

​

​

​

​

关于 nvm(可选)​

Mac/Linux 用户的初始化脚本已自动安装 nvm(Node 版本管理器)。Windows 用户如果想管理多个 Node.js 版本,可以安装 nvm:​

​

​

下载连接:https://ghfast.top/https://github.com/coreybutler/nvm-windows/releases/download/1.2.2/nvm-setup.zip​

或者:https://nvm.uihtm.com/nvm-1.2.2-setup.zip​

下载安装后设置镜像:​

​

代码块​

Plain Text

nvm node_mirror https://npmmirror.com/mirrors/node/nvm npm_mirror https://npmmirror.com/mirrors/npm/​

​

常用命令:​

​

代码块​

Plain Text

nvm install 24.13.0 # 安装指定版本nvm use 24.13.0 # 使用指定版本nvm list # 查看已安装版本​

​

nvm list查看版本​

nvm use 22切换版本​

nvm install 20安装版本​

​

💡 练习:点击不同版本进行切换,观察当前版本的变化。​

🎯 核心概念:nvm 让你可以在同一台电脑上管理多个 Node.js 版本。​

​

​

​

常见问题​

Q: 安装过程中遇到错误?​

把错误信息复制给 AI,它会帮你解决。​

Q: 必须用 GLM 吗?​

不是。Claude Code 默认使用 Claude 官方模型,但国内访问需要中转。GLM 是性价比很高的替代方案,你也可以配置其他国内模型,如 Minimax 、 豆包、 千问等。​

Q: 单独安装过 Node.js,还可以安装 nvm 吗?​

可以。nvm 会管理独立的 Node.js 版本,不影响你之前安装的版本。安装 nvm 后,你可以用 nvm use 切换不同版本,或者用 nvm install 安装新版本。​