目录

一、前置准备（先做这几件事）

二、安装和使用 Claude Code（终端运行）

第一步：安装 Claude Code

第二步：配置 Claude Code 所需的环境变量

第三步：注册API平台并获取APIKey

第四步：重新打开终端窗口

第四步：开始使用 Claude Code

三、安装和使用 Claude Code（Vscode运行）

步骤 1：安装 Chat for Claude Code 插件

四、Claude Code 实践案例（含可直接使用的提示词）

---

在 2025 年的 AI 编程时代，很多人都听说过 Claude Code 的强大：写代码、查问题、补功能、甚至能从 UI 图片直接生成前端页面。
但真正让人头疼的其实只有一件事——环境配置。

没错，最难、最容易踩坑的就是 Claude Code 的本地环境部署；
而 VSCode 插件？
只要你把 Claude Code 配好，装个插件、点几下配置，直接就能用。

所以这篇文章我会带你完成两件事：

• 🛠 搞定最核心、最困难的：Claude Code 本地环境部署

• ⚙️ 然后用最简单的步骤，把 VSCode 插件配置好，立刻开始写代码

本教程会用最通俗的方式，把每一步拆得足够细、足够清楚，让你照着做就能跑通。
如果你之前安装失败、报错不断、命令行看不懂……这篇就是为你准备的。

准备好了吗？
我们从最关键的 Claude Code 环境配置 开始搞起！🚀

一、前置准备（先做这几件事）

1. Node.js 18 或更高版本 请前往 Node.js 官方网站安装最新 LTS 版本，确保 Claude Code 能正常运行。

2. Git（Windows 用户必需） 如果你使用 Windows，请提前安装 Git for Windows，否则后续依赖安装可能失败。

Node.js可参考：【2025年最新版】Node.js安装及环境配置超详细教程（以win11为例子）

Git安装可参考：【2025年最新版】Git安装及环境配置超详细教程（以win11为例子）

二、安装和使用 Claude Code（终端运行）

在使用 Claude Code 之前，我们需要先完成工具安装和环境变量配置。下面按照步骤一步步来，非常简单。

第一步：安装 Claude Code

打开你的命令行工具，直接输入以下命令即可全局安装 Claude Code：

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

安装完成后，输入下面的命令查看是否安装成功。只要能看到版本号，就表示已经就绪：

claude --version

第二步：配置 Claude Code 所需的环境变量

Claude Code 安装好后，需要手动指定 API 地址、Key 以及模型信息。首先在C:\Users\LucasTTboy\.claude创建一个文件夹 settings.json，然后将文件内容修改为以下格式，并替换成你自己的环境变量值：（其中"sk-xxx"需要替换成自己的APIKey！！！）

{
    "env": {
        "ANTHROPIC_AUTH_TOKEN": "sk-xxx",
        "ANTHROPIC_BASE_URL": "https://linoapi.com.cn",
        "API_TIMEOUT_MS": "3000000",
        "ANTHROPIC_MODEL": "claude-haiku-4-5-20251001"
    }
}

第三步：注册API平台并获取APIKey

首先进入到API平台：https://linoapi.com.cn/register?aff=sJ68，点击右上角的登录/注册按钮。

刚开始注册会送0.4元的，如果不够可以去【钱包】那边适当充值。

接下来点击【API令牌】，点击【添加令牌】

填写好名称和选择好分组，这里分组一定要选择【Claude Code专属】

额度这边可以适当调整，其它的参数都默认即可，然后点击【提交】。

点击复制那个秘钥就可以了。

然后在【模型广场】中搜索“Claude”，就会有很多不一样的模型，可以选择一个复制到上面配置的"ANTHROPIC_MODEL"，这里我填写了"claude-haiku-4-5-20251001"。

第四步：重新打开终端窗口

环境变量修改完成后，一定需要重新打开一个新的终端窗口，配置才能生效。

第四步：开始使用 Claude Code

进入你的项目目录，运行claude。

cd test_code
claude

输入claude之后，来到第一个选项，直接默认选择继续即可。

这时 Claude Code 就正式启动了。

通过以上步骤，你已经成功完成 Claude Code 的安装、环境配置信息和模型验证。下一步，就可以开始愉快地进行 AI 辅助开发了 🚀！

三、安装和使用 Claude Code（Vscode运行）

为了让 Claude Code 能在 VS Code 中无缝使用，需要完成插件安装、参数配置以及启动流程。下面按照操作顺序分步骤说明。

步骤 1：安装 Chat for Claude Code 插件

首先，打开 VS Code。点击左侧边栏的 扩展（Extensions） 图标，在搜索框输入：Chat for Claude Code，找到插件后点击 Install（安装）。

📌 安装完成后，VS Code 左侧会新增一个 Claude 面板。

打开Claude Code Chat，根据上面已经配置好的Claude Code，这里就可以直接用了。是不是非常方便哈哈哈。

来到Claude Code Chat的设置这里，打钩"Enable Yolo Mode (Auto-allow all permissions)"可以添加给Claude Code的权限，就不需要每次点击那个"allow"的按钮了。

四、Claude Code 实践案例（含可直接使用的提示词）

做一个“明天吃什么”应用，请以 抽签x美食探险的风格，随机生成一个“明天吃什么"应用。需包含:
1.推荐菜名(可本地/全球随机，但是能在实际生活中找到)
2.食运签名(菜品背后的绝佳寓意)3.推荐理由(结合合菜品本身发散推荐理由)
风格整体需美观、有仪式感，符合美食氛围有食物emoji和音效，带惊喜感。

看起来感觉还行哈哈哈，这还只是一次运行的结果，后期可以添加更多的要素和直接做成一个小产品都行。

到这里，整个 Claude Code（本地部署）+ VSCode 插件可视化使用 的全流程就全部跑通啦！你会发现：其实真正复杂的只有第一次环境配置；
一旦把 Claude Code 配好，无论是在终端里写代码，还是在 VS Code 的 Chat 面板里进行可视化交互，都能体验到——“AI 程序员就在你电脑里”的感觉。

后续你还能继续尝试：

• 给 Claude Code 添加更多系统能力（执行命令、运行脚本、自动创建文件）

• 把它与前端、后端、爬虫、小工具开发串联起来

• 甚至让它根据 UI 草图、设计稿、截图，直接生成可运行的完整项目

这才是 AI 编程的真正魅力：你写一句话，它写一整个功能。

如果你在配置过程中遇到任何报错、异常、权限问题，也可以继续来问我，我可以帮你排查——从 npm、环境变量、模型配置，到命令行问题全部都能搞定。

祝你早日用 Claude Code 做出你的第一个“小作品”！🚀
我们下篇教程再见！