Codex Cloudflare Pages插件部署静态网站全球加速分发指南

想要将本地编写完成的HTML页面一键部署至全球200余个节点，确保用户无论身处东京、圣保罗还是开普敦，都能享受毫秒级响应速度？借助Cloudflare Pages插件，无需通过GitHub建立仓库或配置CI流程，直接拖拽即可完成部署。下面进入详细操作步骤。

打开VS Code扩展市场，搜索“Codex Cloudflare Pages”，点击安装→重启VS Code→按Ctrl+Shift+P（Windows/Linux）或Cmd+Shift+P（macOS）调出命令面板。输入“Cloudflare Pages: Setup Account”，回车后跳转至Cloudflare登录页面；使用GitHub账号授权时【务必勾选“pages:read pages:write”权限】，否则后续无法触发部署流程。

授权成功后，插件会在VS Code状态栏右下角自动显示“CF Pages Ready”。此步骤失败最常见的原因是浏览器弹窗被拦截，手动放行即可解决。

安装并启用Codex Cloudflare Pages插件

操作非常直观：安装插件后重启VS Code，然后通过命令面板完成账号配置。注意在授权GitHub时，必须勾选pages:read和pages:write权限，否则后续部署会卡住。授权成功后状态栏会显示“CF Pages Ready”，若未看到，请检查浏览器弹窗是否被拦截。

用插件部署纯HTML静态站

两种常用方式供选择：

方法一：直接拖拽文件夹
在VS Code资源管理器中，右键点击包含index.html的根目录→选择“Deploy to Cloudflare Pages”→插件自动识别为纯静态项目，构建预设默认设为“None”，输出目录默认为“.”。确认后直接上传。

方法二：命令面板部署
按Ctrl+Shift+P→输入“Cloudflare Pages: Deploy”→选择目标文件夹→确认后插件跳过npm install等冗余步骤，直接打包上传。

部署日志会显示在VS Code底部终端，看到“✅ Deployment successful”及绿色URL链接即表示完成。默认域名格式为https://your-project-name.pages.dev，首次访问可能需要等待30秒边缘节点同步——这是全球CDN正常的预热过程。

绑定自定义域名并强制HTTPS

第一步：确保DNS已托管至Cloudflare
登录Cloudflare控制台→进入DNS设置→检查域名状态是否为“Active”；若显示“Offline”，说明NS记录尚未切换，需前往域名注册商处将NS改为Cloudflare提供的地址（如lila.ns.cloudflare.com）。此步骤未完成前，后续绑定域名均无法进行。

第二步：在Pages项目中添加域名
进入Cloudflare控制台→Workers & Pages→找到对应项目→点击“Custom domains”→输入你的域名（如example.com）→点击“Add domain”。【主域名example.com必须完成DNS迁移，二级域名www.example.com可直接通过CNAME指向your-project-name.pages.dev】

第三步：验证并激活
Cloudflare会自动下发TXT验证记录→回到DNS设置页面，确认该TXT记录已存在→返回Pages页面点击“Check DNS records”→状态变为“Active”后，HTTPS证书会在10秒内自动签发，无需任何手动干预。

排查404与路径错误

如果访问自定义域名时出现404，请先检查HTML中资源路径是否全部使用相对路径：/css/style.css会导致失败，应改为./css/style.css；绝对路径开头的斜杠会被解析为根目录，而Pages默认部署在域名根路径，因此根路径本身没问题——但如果你使用了/开头且项目不在根目录，就会导致找不到资源。

对于Vue或Vite项目，需额外处理：打开vite.config.js，确认base选项设置为'/'而非'./'或'/my-app/'；React项目检查package.json中homepage字段是否设为"."或"https://your-domain.com"，否则构建产物的JS/CSS路径会多一层前缀，引发404。

纯HTML项目最简单的验证方法：将所有和