Express 默认不自动托管 HTML 中的 <img> 路径，必须用 express.static() 显式配置静态目录，且 HTML 中 src 路径需与挂载点严格匹配，否则返回 404。
Express 默认不自动托管 HTML 中的 <img> 路径
HTML 里写 <img src="images/cat.jpg">，浏览器会发请求到 /images/cat.jpg，但 Express 不会自己去文件系统找这个路径——它只认你明确配置的静态目录。没配，就 404。
常见错误现象：GET /images/cat.jpg 404、图片显示为破损图标、控制台报“Failed to load resource”。
- 必须用
express.static()显式声明哪个本地文件夹对应哪个 URL 前缀 - 路径匹配是前缀匹配：挂载在
/static，那src="/static/images/cat.jpg"才能命中 - 别把图片放在
node_modules或src/这类非公开目录下——Express 默认不读这些地方
express.static() 的挂载位置和 URL 路径要对齐
比如你想让 public/images/cat.jpg 通过 /images/cat.jpg 访问，就得把 public 挂到根路径；如果挂到 /static，那 HTML 里就得写 src="/static/images/cat.jpg"。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 推荐把所有静态资源（
images/、css/、js/）统一放public/目录，然后用app.use(express.static('public')) - 如果项目已有前端构建工具（如 Vite、Webpack），它通常生成
dist/，那就挂app.use(express.static('dist'))，HTML 中路径保持构建输出的结构 - 挂载顺序很重要：静态中间件要放在路由之前，否则路由先捕获了
/images/xxx请求，就进不了静态服务
HTML 中的 src 路径写法取决于 Express 挂载点
不是“怎么写都行”，而是必须和 express.static() 的挂载路径严格对应。错一个字符，图片就加载失败。
对比场景：
- 挂载：
app.use('/assets', express.static('public'))→ HTML 中必须写src="/assets/images/cat.jpg" - 挂载：
app.use(express.static('public'))→ HTML 中写src="/images/cat.jpg"（注意开头的/） - 绝对路径
/images/和相对路径images/行为不同：后者会相对于当前 HTML URL 拼接，容易出错，一律用绝对路径
图片路径 404 时优先检查三件事
别急着改代码，先确认基础链路通不通：
- 文件是否真在磁盘上？路径大小写是否一致？Windows 不敏感，Linux/macOS 敏感，
Cat.jpg≠cat.jpg - 启动 Express 后，直接在浏览器访问
http://localhost:3000/images/cat.jpg，看能不能下载——这是最干净的验证方式 - 用
curl -I http://localhost:3000/images/cat.jpg看响应头，确认返回的是200且Content-Type: image/jpeg，而不是text/html（说明被某个路由 fallback 拦截了）
真实项目里，最容易被忽略的是构建产物路径和 Express 挂载点之间的映射关系——改了前端打包配置，却忘了同步调整后端静态服务配置。
