缓存更新后样式没生效，怎么破？
我用 webpack 打包的项目，每次改完 CSS 都会生成带 hash 的文件名，但线上用户有时候还是看到旧样式。我试过在 link 标签里加版本号，也确认服务器没开强缓存，可问题还是偶尔出现。
比如这段按钮样式明明改了背景色，但刷新后还是老颜色：
.btn-primary {
background-color: #007bff;
border: none;
padding: 8px 16px;
border-radius: 4px;
}是不是我漏了什么缓存策略？CDN 还需要额外配置吗？
- 1
回答
33浏览
缓存更新后样式没生效，是CSS缓存问题吗？
我改了页面的按钮样式，本地测试没问题，但上线后用户看到的还是旧样式。强制刷新才生效，是不是浏览器缓存没更新？ 我已经在构建时给CSS文件加了hash，但好像没起作用。下面是修改后的关键样式： .btn...
- 2
回答
65浏览
React Native热更新后样式没生效是怎么回事？
我用CodePush做热更新，改了样式之后推上去，App里内容变了但样式还是旧的，缓存清了也没用，是不是哪里配置错了？ 本地开发时样式正常，一热更新就失效。我试过重启App、清除缓存，甚至重装App都...
- 2
回答
38浏览
Hybrid应用热更新时CSS样式不生效怎么办？
在做Hybrid app的热更新时，我改了页面按钮的CSS样式，但新样式完全没生效。之前用vue-hotreload-api能更新JS，但CSS怎么都不行。 我尝试过清除缓存、检查网络请求发现新CSS...
- 2
回答
54浏览
PWA中Cache API缓存的资源怎么更新不生效？
我在做PWA离线功能，用Cache API缓存了静态资源，但更新文件后刷新页面还是加载旧缓存，试过改cacheName也不行。 service worker里是这样写的： self.addEventL...
- 2
回答
44浏览
Service Worker 缓存 CSS 文件后样式不生效怎么办？
我用 Service Worker 缓存了静态资源，但发现页面加载时有时候 CSS 样式没应用上，刷新一下又好了。是不是缓存策略写错了？ 我试过在 install 事件里缓存 CSS，也确认文件路径没...
- 2
回答
83浏览
Vue项目HMR更新后样式没变化是怎么回事？
在用Vue3+Vite开发时，修改组件样式后HMR虽然触发了更新，但页面样式就是不生效，得手动刷新才看得见变化，这正常吗？ 比如这个组件： <template> <div class...
- 1
回答
23浏览
Cache API 缓存的资源怎么更新不生效？
我在 Service Worker 里用 Cache API 缓存了静态资源，但改了 JS 文件后刷新页面还是加载旧的，明明已经更新了版本号啊。 我试过在 install 事件里换新的缓存名，比如从 ...
- 2
回答
27浏览
Taro 中自定义组件样式不生效怎么办？
我在 Taro 里写了个自定义按钮组件，但加了 class 样式死活不生效，真机调试也没报错，就是没样式。试过用 !important 也不行，是不是 Taro 的样式作用域有问题？ 组件里是这么写的...
- 1
回答
62浏览
缓存更新后用户还是看到旧数据怎么办？
我在做前端接口缓存，用的是 localStorage 存接口返回的数据。但后台数据更新后，用户刷新页面还是看到老内容，除非手动清缓存。有没有办法自动判断数据是否过期？ 我试过加时间戳字段，比如 cac...
- 1
回答
25浏览
Final Form 表单验证后错误信息样式不生效怎么办？
我在用 Final Form 做表单验证，错误信息能正常显示出来，但自定义的红色提示样式死活不生效，明明 CSS 写了啊！ 试过给 .error 类加 !important，也检查了类名有没有拼错，但...
先说最可能的根因：CDN缓存没清掉。
你确认服务器没开强缓存是对的，但CDN这一层很容易被忽略。CDN节点分布在全国各地，每个节点都可能缓存着旧文件，用户访问到哪个节点就看到什么效果，这就是为什么"偶尔"出问题。
排查步骤：
1. 打开浏览器Network面板，看请求这个CSS文件时返回的HTTP状态码。如果是200且来自CDN，那就是CDN缓存了旧文件。如果是304，说明浏览器在跟服务器协商，这个通常没问题。
2. 看看构建后生成的HTML里，link标签的href是不是每次都变。有些人喜欢手动在后面加?v=xxx，但如果你加的是固定值或者构建时没更新这个版本号，那等于没加。正确做法是让webpack的html-webpack-plugin自动处理，它会在引入的文件后面加hash。
3. CDN配置方面，如果是国内CDN，通常有"缓存过期设置"或者"参数跟随"之类的选项。最好把CSS这类静态资源的缓存时间设短一点，比如几分钟或者十几分钟，同时确保CDN会跟随URL参数或hash来区分不同版本。
4. 还有一个容易漏的：浏览器本身的disk cache。你在本地测试时即使服务器返回了新文件，浏览器也可能从本地缓存读。开发时最好用无痕模式或者手动clear cache。
最后提醒一句，检查一下你的webpack配置里CSS文件用的是不是contenthash而不是chunkhash。chunkhash是按chunk计算的，如果CSS和JS在同一个chunk里，JS没变的话CSS的hash可能也不变。改成contenthash会准确一些。
如果还有问题，把CDN那边返回的Cache-Control响应头发出来看看。
解决：给入口HTML设Cache-Control: no-cache，让CDN也不缓存HTML。CSS用contenthash而不是chunkhash。