这篇文章记录搭建个人介绍网站的完整过程：把网站代码放在 GitHub，通过 Cloudflare Workers 自动部署，再使用域名注册商注册的域名作为正式访问地址。
最终工作流是：
GitHub 保存代码 → Cloudflare 自动构建和部署 → Workers 提供运行环境 → 自定义域名对外访问
最终网站地址示例：
一、各个平台分别负责什么
GitHub：保存网站源代码
GitHub 是代码仓库。页面、组件、图片、博客 Markdown 文件和项目配置都保存在仓库中。可以使用类似 your-name/your-portfolio 的仓库名称。
Cloudflare：构建、部署和运行网站
Cloudflare Workers 负责接收代码、安装依赖、执行构建，并将网站发布到网络中。连接 GitHub 后，每次提交代码都可以自动触发新的部署。
域名注册商：注册和管理域名
域名注册商负责注册域名。域名注册商不等于网站服务器，购买域名后，还需要把域名的 DNS 委派给 Cloudflare，并把域名连接到 Worker。
二、准备工作
开始前需要准备：
1. 一个 GitHub 账号
2. 一个可以正常构建的网站项目
3. 一个已经注册并完成实名认证的域名
4. 一个 Cloudflare 账号
如果只是测试，可以先使用 Cloudflare 自动提供的 workers.dev 地址。正式对外使用时，再绑定自己的域名。
三、在 GitHub 创建网站仓库
如果项目还没有仓库，可以在 GitHub 中创建新的 Repository，然后把网站代码上传进去。
仓库通常需要包含：
- package.json
- package-lock.json 或其他锁定文件
- 网站源代码目录
- public 静态资源目录（如果项目使用）
- 正确的构建配置
创建后，先确认项目可以正常构建，再把代码提交到 GitHub。锁定文件也要一起提交，否则 Cloudflare 使用 npm ci 安装依赖时可能会失败。
四、连接 GitHub 并部署到 Cloudflare
进入 Cloudflare 控制台：
1. 打开 Workers & Pages
2. 选择 Create application
3. 选择 Connect GitHub
4. 授权 Cloudflare 访问 GitHub 仓库
5. 选择自己的个人网站仓库
6. 填写项目名称
7. 填写构建命令，例如 npm run build
8. 根据项目类型填写部署命令，例如 npx wrangler deploy
9. 点击部署
部署成功后，Cloudflare 会提供临时访问地址，例如：
https://your-worker.your-account.workers.dev
这个地址适合测试部署是否正常。绑定自定义域名后，访客就不必记住这个较长的地址。
遇到 npm ci 错误怎么办
如果日志提示 package.json 和 package-lock.json 不同步，说明依赖清单和锁定文件不一致。可以在项目目录执行一次依赖安装，让锁定文件更新，然后把更新后的 package-lock.json 提交到 GitHub，再重新部署。
这类问题通常不是 Cloudflare 故障，而是项目依赖文件没有保持同步。
五、注册自己的正式域名
可以在域名注册商搜索并注册域名。注册后需要注意：
- 完成域名实名认证
- 确认域名状态正常
- 记下域名到期时间
- 不要把域名注册商和网站托管商混为一谈
下面以 your-domain.example 作为示例域名。
六、把域名添加到 Cloudflare
在 Cloudflare 中打开域名管理，选择添加或连接域名：
1. 输入自己的完整域名，例如 your-domain.example
2. 选择 Free 计划即可开始使用
3. Cloudflare 扫描 DNS 记录
4. 按提示继续激活
5. Cloudflare 会分配两条名称服务器
名称服务器不是访客输入的地址，而是域名系统用来寻找 DNS 记录的服务器。Cloudflare 分配的名称服务器必须原样填写，不能自己编造。
七、在域名注册商替换名称服务器
进入域名注册商控制台：
1. 找到自己的域名，点击管理
2. 进入 DNS 管理 → DNS 修改
3. 选择修改为自定义 DNS
4. 删除注册商默认的名称服务器
5. 填入 Cloudflare 分配的两条名称服务器
6. 点击确定
7. 按提示完成验证
Cloudflare 会为每个域名分配专属的名称服务器。请以 Cloudflare 控制台显示的内容为准，例如：
Cloudflare-assigned-nameserver-1Cloudflare-assigned-nameserver-2
提交后，Cloudflare 需要等待 DNS 传播。通常几分钟到数小时，最长可能需要 24 小时。传播期间正式域名可能暂时无法访问或出现 SSL 错误，这不一定代表配置错误。
八、把正式域名连接到现有 Worker
DNS 激活后，进入 Workers & Pages → 你的 Worker → Domains → Add Domain：
1. 搜索并选择自己的域名
2. 如果要使用根域名，子域名保持为空
3. 点击 Add domain
4. 等待列表中出现自己的域名，类型为 Production
子域名留空表示使用根域名。这样用户访问自己的域名时，就会进入当前的 Worker。
九、最终访问地址
根域名和页面路径组合后，地址就是：
如果还想使用 www.your-domain.example，需要额外添加 www 子域名，并根据需要设置跳转。它不会因为根域名配置完成就自动拥有完全相同的配置。
十、日常更新方式
网站上线后，日常维护非常简单：
1. 修改页面、组件或 content/blog/ 中的 Markdown 文件
2. 提交代码到 GitHub
3. Cloudflare 自动检测新的提交
4. 自动安装依赖并构建
5. 自动发布新版本
因此，新增一篇博客通常只需要新增一个带有标题、分类、日期和摘要的 Markdown 文件，不需要修改博客页面代码。
十一、常见问题
1. 为什么电脑能打开，手机或其他人打不开？
可能是本地 DNS 缓存、网络线路、代理或 Cloudflare 节点访问差异。可以分别使用手机 Wi-Fi 和移动数据测试。如果只有开启 VPN 才能访问，说明问题可能在网络路径，而不一定是网站代码。
2. 换成自己的域名后，国内用户一定能访问吗？
不一定。自定义域名只解决地址问题，不能保证所有网络环境都能稳定访问 Cloudflare。若网站主要面向中国大陆用户，并且访问稳定性是硬要求，需要评估国内云服务器、CDN 和 ICP 备案方案。
3. DNS 是不是让用户填写的？
不是。用户只需要在浏览器输入域名。DNS 在后台自动把域名解析到对应服务，访客不会看到名称服务器配置。
4. 修改代码后为什么网站没有立即变化？
先检查 Cloudflare 部署记录是否成功，再确认浏览器缓存和 Cloudflare 缓存。部署成功后，硬刷新或更换网络测试通常可以排除本地缓存问题。
总结
对于静态或前端为主的个人介绍网站，GitHub + Cloudflare Workers + 自定义域名是一套轻量方案：
- GitHub 管理代码
- Cloudflare 自动构建和部署
- Workers 托管网站
- 域名注册商提供正式地址
- DNS 把域名和 Cloudflare 连接起来
真正需要理解的关键点只有三个：代码放在哪里、网站部署到哪里、域名如何通过 DNS 指向部署服务。把这三件事连接起来，网站就完成了从本地项目到正式上线的闭环。