ExpressJS服务端渲染时静态CSS、HTML文件更新不生效问题求助

问题解决步骤 #

1. 修复CSS语法错误（核心原因） #

你写的CSS代码中，全局通配符*的规则块闭合花括号后多了一个多余的分号：

* {
    font-size: 16px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    text-decoration: none;
    list-style-type: none;
    padding: 0;
    margin: 0;
};  /* 此处的分号是无效语法，会导致后续所有CSS规则解析失败 */

直接删除这个多余的分号，仅保留闭合花括号}即可，后续的header、.salami等样式规则就能正常解析生效。

2. 解决304缓存导致的文件不更新问题 #

304是浏览器协商缓存的状态码，代表浏览器使用了本地缓存的旧版本静态文件，没有拉取服务端最新的文件，可通过两种方式解决：

• 开发阶段配置express.static禁用静态资源缓存，修改服务端静态资源配置代码：

app.use(express.static(path.join(__dirname, 'public'), {
  etag: false,
  lastModified: false,
  cacheControl: false,
  maxAge: 0
}))

• 调试时使用浏览器强制刷新快捷键跳过缓存：Windows/Linux按Ctrl+Shift+R，Mac按Cmd+Shift+R。

3. 验证路径正确性 #

确保你的项目文件结构匹配资源引用路径：public目录下必须存在css/index.css文件，和HTML中link标签的href="/css/index.css"路径完全对应。

完成上述操作后刷新页面即可看到新增样式生效。

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