企业官网建设流程全解析

前言

本文总结了在本地 Windows VSCode 中安装配置 Claude Code + DeepSeek V4 的完整流程，以及在远程 ARM64 板子（Ubuntu 20.04）上部署 Claude Code 的方案选型过程。

参考视频：在VSCode中配置Claude Code并接入DeepSeek V4(ccswitch+claudecode extension)

一、本地 VSCode 安装配置 Claude Code

整体架构：

VSCode 编辑器 └── Claude Code for VS Code（插件） └── CC Switch（模型网关 / 本地路由） └── DeepSeek V4-Pro / V4-Flash（API 模型）

CC Switch 的作用是在不破坏 Claude Code 原生体验的前提下，将 API 请求透明地桥接到第三方模型（如 DeepSeek V4）。

1.1 环境准备

检查版本：

code--version node--version git--version

1.2 安装 Claude Code CLI

重要变更（2026年）：Anthropic 官方已从 npm 迁移到原生安装器，npm 方式虽仍可用但已标记为废弃。推荐使用原生安装器。

方式一：WinGet 安装（推荐，最简洁）

winget install Anthropic.ClaudeCode

方式二：PowerShell 脚本安装

irmhttps://claude.ai/install.ps1|iex

安装完成后，确保C:\Users\<用户名>\.local\bin\已添加到系统 PATH 环境变量。

方式三：npm 安装（备用，需 Node.js ≥ 18）

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

验证安装：

claude--version# 预期输出：Claude Code v2.1.x (native)

1.3 安装 VSCode 扩展

第一步：打开 VSCode，按Ctrl+Shift+X打开扩展面板

第二步：搜索Claude Code，务必确认发布者为Anthropic（避免第三方仿冒版本）

第三步：点击Install安装

命令行安装方式：

code--install-extensionanthropic.claude-code

安装成功后，VSCode 右上角会出现 ⚡ Spark 图标，底部状态栏会出现 ✱ Claude Code 入口。

三种打开方式：

三种模式（Shift+Tab 循环切换）：

1.4 安装 CC Switch

CC Switch 是一个模型网关工具，负责在本地将 Claude Code 的 API 请求路由到第三方模型。

GitHub 仓库：farion1231/ccswitch

各平台安装方式：

Windows 安装步骤：

1. 前往 CC Switch Releases 下载最新版.msi
2. 双击运行，全程默认下一步完成安装
3. 启动 CC Switch，系统托盘会出现图标

1.5 获取 DeepSeek API Key

1. 访问 platform.deepseek.com
2. 注册账号并登录
3. 进入API Keys→ 点击创建 API Key
4. 复制生成的sk-开头的密钥，妥善保存

省钱小贴士：DeepSeek V4-Pro 限时 2.5 折，充值 10 元就能用很久。也可以使用阿里百炼（新用户送 100 万 V4 Token，90 天有效）。

1.6 CC Switch 配置 DeepSeek

第一步：打开 CC Switch，点击右上角+按钮添加新供应商

第二步：供应商类型选择DeepSeek

第三步：填写配置参数：

提示：模型名加[1m]后缀（如deepseek-v4-pro[1m]）可启用 100 万 token 超长上下文。

第四步：点击添加保存配置

第五步：在首页点击刚创建的配置 → 点击启用

第六步：使用健康检查按钮测试连通性

1.7 VSCode 侧最终配置

打开 VSCode 设置（Ctrl+,）→ 搜索claudeCode.environmentVariables→ 点击在 settings.json 中编辑：

{"claudeCode.environmentVariables":[{"name":"ANTHROPIC_BASE_URL","value":"https://api.deepseek.com/anthropic"},{"name":"ANTHROPIC_AUTH_TOKEN","value":"sk-你的DeepSeek_API_Key"},{"name":"ANTHROPIC_DEFAULT_MODEL","value":"deepseek-v4-pro"}]}

补充说明：如果你已经在 CC Switch 中启用了 DeepSeek 配置，Claude Code 插件通常会自动检测到 CC Switch 的路由规则，无需手动配置以上环境变量。以上配置作为手动直连的备选方案。

1.8 验证与使用

1. 重启 VSCode
2. 打开任意代码文件
3. 点击右上角 ⚡ 图标，或按Ctrl+Esc切换焦点到 Claude Code
4. 输入/model查看当前模型：

当前模型：deepseek-v4-pro

核心快捷键速查：

二、远程板子（Ubuntu 20.04 ARM64）安装 Claude Code

2.1 环境背景

• 硬件平台：飞凌 OK3568 开发板
• CPU 架构：aarch64 / ARM64
• 操作系统：Ubuntu 20.04 LTS（Linux 4.19.206）
• 使用场景：开发 BMS 电池管理系统（C/C++ 项目），希望借助 AI 编程助手提高在板调试效率

2.2 问题分析：三重障碍

在远程 ARM64 板子上使用 Claude Code 面临三重障碍。

障碍一：VSCode 扩展不支持 ARM64 架构

Claude Code 的 VSCode 扩展anthropic.claude-code目前仅发布linux-x64版本，没有linux-arm64构建。通过 VSCode Remote SSH 连接板子后，无法像本地一样安装和使用 Claude Code 的图形化扩展。

相关讨论见 GitHub Issue（bubble 项目 #248）：VS Code 市场 API 在按linux-arm64平台过滤查询时返回空结果。

障碍二：Ubuntu 20.04 的 glibc 版本过低

Ubuntu 20.04 自带的 glibc 版本为2.31：版本不满足某些新版 Node.js 二进制的要求（Node.js 22+ 需要 glibc ≥ 2.35）。强行安装新版 Node.js 会报错：

/lib/aarch64-linux-gnu/libc.so.6: version `GLIBC_2.34' not found

障碍三：板子资源受限

嵌入式板子 CPU 性能和内存都有限（通常 2-4GB RAM），运行完整的 VSCode Server 本身就消耗大量资源，再叠加 AI 编程助手可能不堪重负。

2.3 可选方案对比

针对以上问题，我们梳理了四种可行方案：

2.4 最终方案：混合策略

我们选择了方案 B + 方案 D 的混合策略：

• 日常开发：在本地 Windows VSCode 中使用 Claude Code 扩展（接入 DeepSeek V4），代码完成后通过scp同步到板子编译运行
• 板上调试：SSH 登录板子后，在终端中直接使用 Claude Code CLI（通过 npm 安装 Node.js 20 LTS 兼容版本），配合tmux保持会话持久化

选择理由：

1. 不需升级系统—— 避免破坏飞凌 BSP 的底层依赖
2. 不依赖 ARM64 VSCode 扩展—— 直接用 CLI 绕过了架构兼容问题
3. 灵活切换—— 主力开发用本地 GUI，紧急板上改 bug 也能用 CLI
4. Node.js 20 LTS 兼容 glibc 2.31—— 这是关键的技术可行性基础

三、总结

关键经验：

1. CC Switch 的 Base URL 必须用/anthropic端点，不能用 OpenAI 兼容的/v1端点，否则模型调用会出错
2. ARM64 板子不要试图装 VSCode 扩展 —— 目前没有linux-arm64构建版本
3. Node.js 版本与 glibc 的匹配是核心 —— Ubuntu 20.04 选 Node.js 20 LTS 是最优解
4. tmux 是远程 CLI 开发的必备工具 —— 断线不断任务，体验提升巨大

最后更新：2026-06-05

参考资料：

• Claude Code 官方文档
• CC Switch GitHub
• DeepSeek API 平台
• B站教程视频
  

  这里写自定义目录标题

  • • 前言
    • 一、本地 VSCode 安装配置 Claude Code
    • • 1.1 环境准备
      • 1.2 安装 Claude Code CLI
      • 1.3 安装 VSCode 扩展
      • 1.4 安装 CC Switch
      • 1.5 获取 DeepSeek API Key
      • 1.6 CC Switch 配置 DeepSeek
      • 1.7 VSCode 侧最终配置
      • 1.8 验证与使用
    • 二、远程板子（Ubuntu 20.04 ARM64）安装 Claude Code
    • • 2.1 环境背景
      • 2.2 问题分析：三重障碍
      • 2.3 可选方案对比
      • 2.4 最终方案：混合策略
    • 三、总结
  • 欢迎使用Markdown编辑器
  • • 新的改变
    • 功能快捷键
    • 合理的创建标题，有助于目录的生成
    • 如何改变文本的样式
    • 插入链接与图片
    • 如何插入一段漂亮的代码片
    • 生成一个适合你的列表
    • 创建一个表格
    • • 设定内容居中、居左、居右
      • SmartyPants
    • 创建一个自定义列表
    • 如何创建一个注脚
    • 注释也是必不可少的
    • KaTeX数学公式
    • 新的甘特图功能，丰富你的文章
    • UML图表
    • 流程图
    • FLowchart流程图
    • 导出与导入
    • • 导出
      • 导入

欢迎使用Markdown编辑器

你好！ 这是你第一次使用Markdown编辑器所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章，了解一下Markdown的基本语法知识。

新的改变

我们对Markdown编辑器进行了一些功能拓展与语法支持，除了标准的Markdown编辑器功能，我们增加了如下几点新功能，帮助你用它写博客：

1. 全新的界面设计，将会带来全新的写作体验；
2. 在创作中心设置你喜爱的代码高亮样式，Markdown将代码片显示选择的高亮样式进行展示；
3. 增加了图片拖拽功能，你可以将本地的图片直接拖拽到编辑区域直接展示；
4. 全新的KaTeX数学公式语法；
5. 增加了支持甘特图的mermaid语法¹功能；
6. 增加了多屏幕编辑Markdown文章功能；
7. 增加了焦点写作模式、预览模式、简洁写作模式、左右区域同步滚轮设置等功能，功能按钮位于编辑区域与预览区域中间；
8. 增加了检查列表功能。

功能快捷键

撤销：Ctrl/Command+Z
重做：Ctrl/Command+Y
加粗：Ctrl/Command+B
斜体：Ctrl/Command+I
标题：Ctrl/Command+Shift+H
无序列表：Ctrl/Command+Shift+U
有序列表：Ctrl/Command+Shift+O
检查列表：Ctrl/Command+Shift+C
插入代码：Ctrl/Command+Shift+K
插入链接：Ctrl/Command+Shift+L
插入图片：Ctrl/Command+Shift+G
查找：Ctrl/Command+F
替换：Ctrl/Command+G

合理的创建标题，有助于目录的生成

直接输入1次#，并按下space后，将生成1级标题。
输入2次#，并按下space后，将生成2级标题。
以此类推，我们支持6级标题。有助于使用TOC语法后生成一个完美的目录。

如何改变文本的样式

强调文本强调文本

加粗文本加粗文本

标记文本

删除文本

引用文本

H₂O is是液体。

2¹⁰运算结果是 1024.

插入链接与图片

链接: link.

图片:

带尺寸的图片:

居中的图片:

居中并且带尺寸的图片:

当然，我们为了让用户更加便捷，我们增加了图片拖拽功能。

如何插入一段漂亮的代码片

去博客设置页面，选择一款你喜欢的代码片高亮样式，下面展示同样高亮的代码片.

// An highlighted blockvarfoo='bar';

生成一个适合你的列表

• 项目
  • 项目
    • 项目

1. 项目1
2. 项目2
3. 项目3

• 计划任务
• 完成任务

创建一个表格

一个简单的表格是这么创建的：

设定内容居中、居左、居右

使用:---------:居中
使用:----------居左
使用----------:居右

SmartyPants

SmartyPants 是一个文本转换工具，主要功能是将普通的 ASCII 标点符号自动转换为更美观的印刷体标点符号。例如：

创建一个自定义列表

Markdown

Text-to-HTMLconversion tool

Authors

John

Luke

如何创建一个注脚

一个具有注脚的文本。²

注释也是必不可少的

Markdown将文本转换为HTML。

KaTeX数学公式

您可以使用渲染LaTeX数学表达式 KaTeX:

Gamma公式展示Γ ( n ) = ( n − 1 ) ! ∀ n ∈ N \Gamma(n) = (n-1)!\quad\forall n\in\mathbb NΓ(n)=(n−1)!∀n∈N是通过欧拉积分

Γ ( z ) = ∫ 0 ∞ t z − 1 e − t d t . \Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.Γ(z)=∫0∞​tz−1e−tdt.

你可以找到更多关于的信息LaTeX数学表达式here.

新的甘特图功能，丰富你的文章

• 关于甘特图语法，参考 这儿,

UML图表

可以使用UML图表进行渲染，例如下面产生的一个序列图：

• 关于UML图表语法，参考 这儿,

流程图

• 关于Mermaid语法，参考 这儿,

FLowchart流程图

我们依旧会支持flowchart.js的流程图语法：

• 关于Flowchart流程图语法，参考 这儿.

导出与导入

导出

如果你想尝试使用此编辑器, 你可以在此篇文章任意编辑。当你完成了一篇文章的写作, 在上方工具栏找到文章导出，生成一个.md文件或者.html文件进行本地保存。

导入

如果你想加载一篇你写过的.md文件，在上方工具栏可以选择导入功能进行对应扩展名的文件导入，
继续你的创作。