上线准备：把作品发给别人看
用本地静态预览把作品从"只有自己能看"变成"能发给别人"——本地与公网步骤都已实际验证。
你的作品到目前为止只有自己能看。这一课把它变成能发给别人看的东西：先本地预览、再局域网分享，最后是把作品发上公网。本课的每一步都实际走通过——你现在看的这个学习站，就是按这条路发布的。
目标
- 你的作品能被另一个设备（或另一个人）打开；
- 你能说清"我的作品现在处于哪个分享阶段、下一步差什么"。
前置条件
- 第一课的作品已完成并通过验收
- 作品是一个文件夹，入口是
index.html（纯 HTML 作品） - 你知道这个文件夹的完整路径
操作步骤
第 1 步：发布前自查（约 10 分钟）
- 双击打开
index.html，把主要页面都点一遍； - 对照第一课的需求说明：每一条都实现了吗？没实现的是不是标注了"尚未实现"？
- 删掉测试期间留下的垃圾：无用的备份文件、草稿、密码便签（任何密钥和口令都不能出现在作品文件夹里）。
第 2 步：本机静态预览（约 5 分钟）
双击打开是"本地预览"的最低形态。更接近真实网站的打开方式是起一个本地静态服务：
# 在作品文件夹内执行（需要 Node.js）
npx serve .终端会显示一个地址（形如 http://localhost:3000）。在浏览器打开它——这个地址同一台电脑上都能访问。
成功检查：浏览器打开该地址，页面与双击打开的效果一致。
第 3 步：发给别人（局域网内，约 10 分钟）
同一个 Wi-Fi 下，serve 默认就能让局域网设备访问：
- 查到自己电脑的局域网 IP（Mac：系统设置 → Wi-Fi → 详细信息，形如
192.168.x.x）； - 用
npx serve . -l 3000保持服务运行； - 让对方在同一 Wi-Fi 下用浏览器打开
http://192.168.x.x:3000。
成功检查：另一台设备能打开你的作品，并且能完成需求说明里的主要操作。
第 4 步：更广的分享方式（无账号依赖）
- 打包发文件：把作品文件夹压缩成 zip，发给对方解压后双击
index.html。适合纯静态、无服务器功能的作品——第一课的作品正是这种。 - 存到代码托管平台：GitHub 等平台可以托管静态页面（通常叫 Pages 功能），适合愿意注册账号的读者。
第 5 步：发上公网（2026-09-17 实测走通）
让任何人通过网址打开你的作品。以 Cloudflare Pages 为例——这套流程就是这个学习站上线时真实走的：
-
准备静态文件：你的作品文件夹（入口
index.html）本身就是"静态产物"，纯 HTML 作品不需要任何构建步骤。 -
登录 Cloudflare 并安装工具：注册 Cloudflare 账号，电脑上执行
npx wrangler login（浏览器里点一次授权）。第一次运行会自动下载 wrangler。 -
创建项目并上传：
npx wrangler pages project create 我的项目名 --production-branch=main npx wrangler pages deploy . --project-name=我的项目名 --branch=main上传完成后终端会给出一个
https://项目名.pages.dev的网址——这一刻你的作品已经全世界可访问了。把它发给任何人试试。 -
（可选）绑定自己的域名：如果你有自己的域名，在域名服务商那里加一条 CNAME 记录指向
项目名.pages.dev，再在 Cloudflare Pages 项目设置里添加这个域名，几分钟内 HTTPS 证书自动签发。本站就是这么把learn.zjy365.dev接上的。
成功检查：用手机流量（不连你家 Wi-Fi）打开 pages.dev 网址，页面完整、样式正常。
成功检查
- 本机通过
http://localhost:3000能打开作品 - 至少一台其他设备能通过局域网地址打开作品
- 作品文件夹里没有密钥、口令等敏感内容
- （走到第 5 步的话）手机流量下
pages.dev网址能打开作品
常见卡点
- 对方打不开局域网地址：确认两台设备在同一个 Wi-Fi；确认你的服务还在运行（终端窗口不能关）。
npx serve报错：先确认装了 Node.js（终端输入node -v有版本号输出），再重试。- 发出去的 zip 解压后样式丢失：检查是不是只发了
index.html没发整个文件夹——样式和图片通常在别的文件里。
下一步
- 收集两三个试用者的反馈，回到排错速查处理问题，完成第一次"上线后迭代"。
- 公网部署后想持续更新：本地改好 → 重新执行第 5 步的上传命令 → 网址自动指向最新版本（静态页面没有"迁移"这回事）。