我在一个复杂的网站上工作，每个页面上都有大量的 css 文件和 js 文件。我正在使用 Chrome 的开发人员工具处理单个 css。一旦 css 在开发人员工具(元素选项卡，样式侧栏)中基本正确，css 将被复制到本地 css 文件，然后上传到 Web 服务器。由于只修改了一个 css 文件，因此重新加载单个 css 文件会更快，而不是硬刷新并重新加载整个站点，包括图像、js 和 css 等。
该站点有一个选项可以缩小 css 文件并将其与其他 css 文件合并，从而创建一个非常大的 css 文件。在开发模式下该选项被关闭。将版本号添加到 css 文件名并不是我要找的技巧。
是否可以在 Chrome 开发者工具中点击源文件并仅刷新该文件？
最佳答案
这有点 hack，但我认为它适用于您的场景。
当我最初加载示例页面时，您可以看到三个 CSS 请求:
我想刷新 devsite-googler-buttons.css 文件，所以我在我的 DOM 树中找到它:
(Command+F 在 Mac 上或 Control+F 在 Windows/Linux 上打开搜索面板在 Elements 面板的底部...使得在大 DOM 中更容易找到东西)
右键单击，选择以 HTML 格式编辑，然后在链接末尾附加一个随机查询字符串:
并且在网络面板中，您可以看到该文件已重新下载:
另请参阅:Konrad's answer提供了一些方便的代码，通过 Snippet 自动执行此操作.
关于css - 如何在 chrome 开发者工具中重新加载单个文件，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45343401/