CSS 代码校验器 csslint: 在 sublime text 编辑器中安装和配置 csslint

目录
[隐藏]

本文主要介绍在 sublime text 3 编辑器中配置 csslint 的方法步骤,以帮助你快速完成相关配置,避免花费更多的时间去探索。

1. 安装 csslint

打开 cmd 命令提示符,使用 node 进行全局安装 csslint

npm i eslint -g –registry=http://registry.npm.taobao.org/ –disturl=https://npm.taobao.org/dist

2. 安装 sublime text 相关插件

打开 sublime text,打开 preferences->Package Control (ctrl+shift+l),搜索和安装如下两个插件:

SublimeLinter
SublimeLinter-csslint

进入项目根目录,新建一个名称为 .csslintrc 的文件,录入相关配置。内容示例参考:

{
    "rules": {
      "known-properties": 2,      //未知的属性报错
      "empty-rules": 1,           //空规则
      "duplicate-properties": 1, //重复属性
      "overqualified": 0,        //允许元素标签的优先级,如 div.test
      "adjoining-classes": 0,    //允许 .foo.bar 格式的连写
      "important": 0             //允许 !important
    }
}

3. fis3 配置 csslint

安装 fis3-lint-csslint 插件:

npm i fis3-lint-csslint -g –registry=http://registry.npm.taobao.org/ –disturl=https://npm.taobao.org/dist

配置:

fis.match('{app,common}/**/*.{css,less}', {
    ignoreFiles: ['*.min.css'],
    rules: {
        "rules": {
          "known-properties": 2,      //未知属性值
          "empty-rules": 1,           //空规则
          "duplicate-properties": 1, //重复属性
          "overqualified": 0,        //允许元素标签的优先级,如 div.test
          "adjoining-classes": 0,    //允许 .foo.bar 格式的连写
          "important": 0             //允许 !important
        }
    }
});

4. 相关参考

https://github.com/CSSLint/csslint/wiki/Rules
https://npm.taobao.org/package/fis3-lint-csslint

点赞 (0)

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

Captcha Code