TS项目中HTML与JS分目录时文件找不到及服务器入口配置问题

为什么会出现404错误？ #

浏览器解析相对路径是基于当前页面的URL，而非本地文件系统的路径，这是核心问题：

• 如果你在项目根目录运行http-server ./，访问页面的URL是http://localhost:8080/public/index.html，此时../dist/index.js会被浏览器解析为http://localhost:8080/dist/index.js——这个路径本身是存在的，若出现404，大概率是你启动http-server时的工作目录不是项目根（比如进入了public目录启动），导致服务器根目录是public/，无法访问上级目录的dist文件夹。
• 把index.js移到根目录后用../index.js仍无法加载，是因为页面URL是http://localhost:8080/public/index.html，../index.js解析为http://localhost:8080/index.js，若仍404，要么是启动时工作目录错误，要么是浏览器缓存导致的路径解析异常。

如何将public/index.html设为服务器入口，同时从根目录提供服务？ #

直接用http-server的启动参数即可实现：

http-server ./ -p 8080 --cors -o /public/index.html

参数说明：

• ./：指定服务器根目录为项目根，确保能访问所有文件夹（dist、src等）
• -o /public/index.html：启动服务器后自动打开public/index.html作为入口页面
• -p 8080 --cors：指定端口并开启跨域支持（保留你原有的需求）

同时，建议修改index.html里的脚本路径为绝对路径（从服务器根目录开始），避免相对路径的混乱：

<script src="/dist/index.js"></script>

这样无论页面URL是什么，都会直接请求http://localhost:8080/dist/index.js，彻底解决路径问题。

内容的提问来源于stack exchange，提问作者dairy