运行npx serve时index.html无法加载问题排查(Caddy+Node.js+Fastify)
问题根因分析
1. npx serve 报错原因
你当前使用的 serve 包版本已不再支持直接传入单个文件路径作为参数,当你执行 npx serve src/public/index.html 时,程序会将传入的 index.html 文件路径误认为工作目录,因此会尝试读取该路径下的 serve.json 配置文件,最终抛出ENOTDIR 错误。此前可正常运行是因为旧版本的 serve 兼容单文件参数,你大概率是在依赖更新时自动升级了 serve 版本导致异常。
2. authsvc.dev 无法访问原因
你的 npm run all 脚本中没有包含 Caddy 服务的启动命令,Caddy 服务未正常运行时反向代理规则不会生效,自然无法通过域名访问站点。
修复方案
步骤1:修改 package.json 脚本配置
调整 ui 脚本的 serve 入参为目录路径,同时可以按需将 Caddy 启动命令加入 all 脚本实现一键启动所有服务:
"scripts": { // 新增caddy启动命令到all脚本,无需单独开终端启动Caddy "all": "concurrently \"npm run server\" \"cd ../ui\" \"npm run ui\" \"npm run caddy\"", "server": "cd ../api && npm run start", // 将serve的入参从单文件改为目录,serve访问根路径会自动加载index.html "ui": "concurrently \"nodemon src/index.js\" \"npx serve src/public/\"", "ui1": "nodemon src/index.js", "ui2": "npx serve src/public/", "caddy": "caddy run", "test": "node --experimental-vm-modules node_modules/jest/bin/jest.js --watchAll" }
步骤2:验证访问
- 停止当前所有运行的相关服务
- 重新执行
npm run all - 直接访问
https://authsvc.dev即可正常加载页面
可选排查项(如修改后仍无法访问域名)
- 检查本地代理软件是否拦截了dev域名的解析,执行
ping authsvc.dev确认解析结果为127.0.0.1 - 确认浏览器访问时使用的是HTTPS协议,Caddy默认会自动签发本地证书并强制HTTPS访问
- 检查5000、4000、80、443端口是否被其他程序占用
内容的提问来源于stack exchange,提问作者briang
相关产品推荐
相关产品推荐

