为何Visual Studio仅在热重载后才能正确渲染CSS？

问题场景 #

• 开发环境：最新版Visual Studio + ASP.NET Core
• 异常表现：页面首次渲染时样式错乱，但修改site.css中的CSS类并保存（触发VS热重载）后，样式能正常显示
• 疑问点：不确定是代码问题，还是IIS、Visual Studio、热重载存在Bug；同时想了解编译后代码的输出情况

排查结论 #

该问题并非代码或开发工具/服务的Bug，根源是浏览器缓存：浏览器会缓存之前加载的CSS文件，首次打开页面时优先读取旧缓存，导致样式不匹配；而热重载会让浏览器重新请求更新后的CSS文件，所以样式恢复正常。

解决方法 #

直接按下Ctrl+F5强制刷新页面，浏览器会忽略缓存重新加载所有资源，样式即可正常显示。

关于编译输出的补充 #

ASP.NET Core开发时，编译后的静态资源（包括CSS）默认会输出到项目目录下的wwwroot文件夹对应的运行/发布目录中。开发模式下，VS会实时将修改的静态资源同步到运行目录，热重载机制会通知浏览器重新加载变更的资源，但首次加载时浏览器仍可能调用旧缓存。

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