Express多级路由下EJS模板CSS加载失败：MIME类型错误问题求助

API 探路者

2026-4-28

问题原因分析

你遇到的这个MIME类型错误，本质是CSS文件的请求路径错误：

当访问/theresa时，浏览器把相对路径css/homePage.css解析为http://localhost:3000/css/homePage.css，正好对应你public目录下的文件，所以能正常加载。
但访问/theresa/overview时，浏览器会把相对路径解析为http://localhost:3000/theresa/css/homePage.css——这个路径根本不存在，Express会返回404的HTML页面，浏览器拿到HTML却当成CSS解析，自然就报MIME类型不匹配的错误了。

快速解决方案

最直接有效的方法是把CSS的引入路径改成绝对路径，在路径开头加上斜杠/：

<link rel="stylesheet" href="/css/homePage.css">

这样不管当前处于哪个路由层级，浏览器都会从网站根目录（也就是你设置的public目录）开始查找CSS文件，请求路径会变成正确的http://localhost:3000/css/homePage.css。

其他可选方案

如果你的项目后续可能有路径调整的需求，还可以试试这两种更灵活的方式：

设置基础URL：在EJS模板的<head>里添加<base href="/">，这样所有相对路径都会以根目录为基准解析。注意如果有其他相对路径的资源（比如图片、JS文件），也要确保它们的路径适配这个基础URL。
使用Express局部变量：在你的Express代码里添加一行，把根路径作为全局变量传给所有模板：
```
app.locals.basePath = '/';
```
然后在EJS里这样引用CSS：
```
<link rel="stylesheet" href="<%= basePath %>css/homePage.css">
```
后续如果需要部署到子目录（比如/theresa作为根路径），只需要修改basePath的值即可，不用逐个修改模板里的路径。