vscode本地启动项目报404，首要排查端口是否被占用导致服务未真正启动；其次检查静态资源路径与开发服务器根目录是否匹配（如public下文件才可直接访问）；最后排除vscode或浏览器插件干扰请求。
VSCode 本身不提供 HTTP 服务，所谓“VSCode 运行网页报 404”，本质是它启动的开发服务器（如 vite、webpack-dev-server、vue-cli-service）没起来，或资源路径和服务器配置对不上。真正要查的不是 VSCode，而是你项目里那个命令背后的实际服务行为。
端口被占导致服务根本没启动
这是最常被忽略的底层原因：你敲了 npm run dev，终端显示 “Vite server running”，但其实只是个假成功——端口早被其他进程占了，Vite 自动 fallback 到一个空服务或代理页，所有 / 下的请求都返回 404。
- 在终端执行
netstat -ano | findstr "3000"（把3000换成你实际用的端口） - 如果返回带 PID 的一行（比如末尾是
12345），说明端口确实被占 - 执行
taskkill /F /pid 12345干掉它 - 再重启终端，重新运行启动命令
- Windows 下若提示
netstat不是内部命令，先cd c:\WINDOWS\system32\再执行
静态资源路径与开发服务器根目录不匹配
开发服务器默认 serve 的根是项目根目录，但你写的 HTML 或 JS 中用了绝对路径，而文件实际不在 public 目录下，就会 404。
-
public/下的文件（如public/js/app.js）可直接通过/js/app.js访问 -
src/下的资源（如src/assets/logo.png）必须经构建处理，不能用/assets/logo.png这种绝对路径引用 - Vite 项目若配置了
base: '/myapp/'，所有资源 URL 会自动加前缀，import './main.js'最终解析为/myapp/main.js - Linux/macOS 部署时大小写敏感：
logo.PNG≠logo.png，本地 Windows 可能不报错，一上环境就 404
VSCode 或浏览器插件偷偷改了请求
某些插件会在页面加载阶段注入脚本、重写 URL 或拦截 fetch，导致资源请求发到错误地址，最终 404。
- Vetur、Auto Rename Tag、Prettier、ESLint 等前端相关插件，在 VSCode 中禁用后重启窗口再试
- Chrome 打开隐身窗口（无扩展），访问同一地址，看是否仍有 404
- 打开浏览器 Network 面板，点开某个 404 请求，看
Initiator列——如果是content-script.js或某个插件名，基本就是它干的 - 油猴（Tampermonkey）、广告屏蔽器、某些“前端助手”类扩展也常有类似行为
真正棘手的 404 往往卡在“服务看似运行，路径看似正确，但就是找不到资源”这个模糊地带。这时候别急着改代码，先确认端口干净、public/src 边界清晰、插件全关——这三步做完，80% 的 404 就消失了。
