预览 HTML、分享构建产物、测 SPA 路由时，本地起一个静态文件服务比直接 file:// 靠谱（避免 CORS、路由 404 等问题）。下面按依赖和场景对比常用方案。
工具对比
| 工具 | 依赖 | 热重载 | 目录浏览 | HTTPS | 配置灵活度 | 亮点 | 适合 |
|---|---|---|---|---|---|---|---|
npx serve | Node | 否 | 是 | 可选 | 低 | 一条命令、零配置 | 最快预览 dist |
npx http-server | Node | 否 | 是 | 可选（-S） | 高 | 端口、缓存、CORS 参数全 | 需要细调参数 |
npx live-server | Node | 是 | 是 | 否 | 中 | 保存即刷新 | 前端页面开发 |
npx static-server | Node | 否 | 是 | 否 | 低 | 极简、零配置 | 快速搭简单服务 |
npx node-static | Node | 否 | 是 | 否 | 低 | 基础静态服务 | 简单开发场景 |
python -m http.server | Python 3 | 否 | 是 | 否 | 低 | 系统自带、零安装 | 没 Node 的机器 |
php -S | PHP | 否 | 否 | 否 | 低 | PHP 内置 | 已有 PHP 环境 |
bunx serve | Bun | 否 | 是 | 可选 | 低 | Bun 生态启动快 | Bun 项目 |
Caddy file-server | Caddy | 否 | 是 | 自动 | 中 | 自动 HTTPS | 本地也要 HTTPS 时 |
推荐
- 默认首选：
npx serve .（或指定目录npx serve ./dist）。 - 开发中要自动刷新：
npx live-server。 - 要改端口、缓存、CORS：
npx http-server。 - 只有 Python：
python -m http.server 8000。
Node 系
serve — 最简单：
npx serve .
npx serve ./dist -l 3000http-server — 参数多：
npx http-server . -p 8080 -c-1 # -c-1 禁用缓存
npx http-server . -p 443 -S -C cert.pem -K key.pem # HTTPS 需证书和私钥live-server — 带热重载：
npx live-server --port=8080 --open=/index.htmlstatic-server — 简洁：
npx static-servernode-static — 基于 Node.js（CLI 命令为 static）：
npx node-static
# 或：npx --package node-static staticPython
python3 -m http.server 8000
# 指定目录：cd dist && python3 -m http.server 8000默认绑定 8000，当前目录即根路径，带目录列表。
其他
PHP 内置（单线程，仅开发用）：
php -S localhost:8080 -t ./distBun：
bunx serve .Caddy（本地 HTTPS）：
caddy file-server --root ./dist --listen :8443注意
- 以上均不要用于生产；无鉴权、无加固。
- SPA 用
history路由时，serve/http-server需加 fallback 到index.html（如serve -s）。 - 大文件或局域网分享时，注意防火墙与绑定地址（
0.0.0.0vs127.0.0.1）。