likes
comments
collection
share

CSS查重开源项目,秒级检查并标注全项目相似度高的CSS。

作者站长头像
站长
· 阅读数 37

自动检查Reduce CSS重复代码

为检查公司项目而制作的自动检查工具。本项目会检查您的 css 样式是否有重复,并在几秒钟内找到具有高度相似性的 css classes 之间的差异。它可以避免文件之间出现冗余或类似的 css,并适用于本地开发和 CI 等自动化。

默认情况下它还支持颜色检查、长脚本以及未使用的 CSS classes 的警告。可以一键检查完全相同及相似度高的CSS Classes、可提示未使用的CSS、CSS优化建议等,可配置阈值.

数百个CSS文件一般只需要2-3秒即可完成,确定性算法,非常高效,可提示重复行。先放上Github地址: CSS-Checker

检查的项目包含:

  • $\geq80%$重复度的class(顺序等不影响结果、结果中会标记哪些行是重复的,可自定义配置阈值)
  • 完全重复的未被定义为variable的颜色(会将Hex, RGB, RGBA, HSL, HSLA)全部转成RGBA统一比较
  • 很长但是多次引用的CSS代码等。
  • 没有被js/jsx/ts/tsx/html引用的css classes(alpha test,默认不开启)
  • 其他内容

具体效果如下:

安装

使用 go:

go install github.com/ruilisi/css-checker@latest

(对于 go 1.17 之前的版本,请使用 go get github.com/ruilisi/css-checker)。或者从releases下载。

使用 npm:

npm install -g css-checker-kit

用法

运行

  • cd PROJECT_WITH_CSS_FILES 并且直接运行:
css-checker

其他用法欢迎到我的github项目查看安装和使用方法:css-checker