【问题标题】:Filter CSS according to used selectors根据使用的选择器过滤 CSS
【发布时间】:2017-06-25 02:44:09
【问题描述】:

我正在实现依赖于 Bootstrap 的 Summernote 编辑器,但我使用自己的自定义样式表。这给了我两个问题:

  1. 它破坏了我的设计,而且 Bootstrap 文件太长,很难找到导致问题的确切选择器。
  2. 它会加载一个 120kB 的文件,而可能只需要 20-30 个文件(编辑器实际需要渲染好的部分)。

有没有人知道一个工具(可能是在线的)可以将源代码中实际使用的标签、类等与所附样式表进行比较,指出正在使用的内容? 经过长时间的开发过程也可能会有所帮助,您在其中进行了大量编辑,最终可能会得到很多未使用的代码。

【问题讨论】:

  • 一个可以考虑的选项是uncss 来识别/删除未使用的CSS。像这样的工具需要构建系统,例如 Gulp 或 Grunt。它只是一种选择,还有更多类似的选择。

标签: html css compare summernote


【解决方案1】:

当您在任何浏览器的网页上时,请右键单击并选择检查元素。

【讨论】:

    【解决方案2】:

    您可以使用 purifyCSS,这需要 grunt 或类似的。有这个站点https://unused-css.com/,它需要您站点的 URL,然后它会扫描该站点的单个页面。还有这个工具:https://sourceforge.net/projects/cssscanner/,它为您提供了已使用和未使用的选择器列表,但您需要一台运行 Windows 的机器才能使用。

    【讨论】:

      猜你喜欢
      • 2023-04-09
      • 1970-01-01
      • 2017-09-22
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-07-15
      • 2019-03-13
      • 2015-06-26
      相关资源
      最近更新 更多