CSShint

chris edited this page May 12, 2016 · 10 revisions

CSSHint

FECSCSS 的检查是基于 EFE 团队王磊 专门针对我们的 CSS 编码规范 打造的 CSSHint

使用方式

最常用的方式就是直接调用fecs,此时会递归的扫描当前目录下面的所有的 JavaScript、CSS 和 HTML 文件(默认已经忽略 node_modules, bower_components 目录),然后依次调用 CSSHint 检查得到的 CSS 文件。

如果想要忽略某些文件或目录,可以使用 ignore 参数执行,例如:

$ fecs --ignore='**/cli/**'

同时也可以使用 .fecsignore 文件来配置类似 Git 方式的 .gitignore 忽略规则。

另外,需要同时检查多个目录时,可以这样:

$ fecs dir1 dir2

可以指定只检查 CSS 文件:

$ fecs dir1 --type=css

如果觉得默认显示的英文提示不易懂,或者需要看我们对应的规范定义,可以指定 reporter 参数为 baidu

$ fecs --reporter=baidu

默认规则

  1. https://github.com/ecomfe/node-csshint/blob/master/lib/config.js
  2. https://github.com/ecomfe/fecs/blob/master/lib/css/csshint.yml

由于部分规则无法实现,加上时间关系,目前对规范的覆盖率只有 62%,以下规则尚未实现:

  • require-after-linebreak
  • group-properties 
  • font-family-space-in-quotes, 
  • font-family-sort, 
  • unifying-font-family-case-sensitive

以上规则之后将达到 72%。

如果想查看检查结果对应的规则名称,可以在执行时使用 rule 参数:

$ fecs --rule

如何针对检查结果作修复

CSSHint 大部分给出的是关于代码风格方面的问题,一般没有特殊情况的话,需要全部都修复掉。对于确实无法修复或有足够理由不作修复的,可以使用 .csshintrc .fecsrc 来覆盖默认的配置(暂不支持文件内注释方式的规则)。

{
    "csshint": {
        "min-font-size": 10
    }
}

如果确定代码在当前场景下合理,可以针对当前文件使用以下语法禁止指定的规则 (需要 csshint@0.0.17 以上版本支持):

/* csshint-disable rule1[,rule2,...] */

后续将实现 format 命令来修复大部分代码风格上的问题。

You can’t perform that action at this time.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session.
Press h to open a hovercard with more details.