SublimeLinter 是前端编码利器——Sublime Text 的一款插件，用于高亮提示用户编写的代码中存在的不规范和错误的写法，支持 JavaScript、CSS、HTML、Java、PHP、Python、Ruby 等十多种开发语言。这篇文章介绍如何在 Windows 中配置 SublimeLinter 进行 JS & CSS 校验。



　　SublimeLinter 是前端编码利器——Sublime Text 的一款插件，用于高亮提示用户编写的代码中存在的不规范和错误的写法，支持 JavaScript、CSS、HTML、Java、PHP、Python、Ruby 等十多种开发语言。这篇文章介绍如何在 Windows 中配置 SublimeLinter 进行 JS & CSS 校验。

借助 SublimeLinter 编写高质量的 JavaScript & CSS 代码_javascript

　　　打开 SublimeLinter 的配置文件，Preferences->Package Settings->SublimeLinter->Settings - User，进行如下配置：


（1）运行模式



"sublimelinter": "save-only",


　　SublimeLinter 的运行模式，总共有四种，含义分别如下：

  • true - 在用户输入时在后台进行即时校验；
  • false - 只有在初始化的时候才进行校验；
  • "load-save" - 当文件加载和保存的时候进行校验；
  • "save-only" - 当文件被保存的时候进行校验；

　　推荐设置为 “save-only”，这样只在编写完代码，保存的时候才校验，Sublime Text 运行会更加流畅。


（2）校验引擎



"sublimelinter_executable_map":
    {
        "javascript":"D:/nodejs/node.exe",
        "css":"D:/nodejs/node.exe"
    }


　　这里是配置 JavaScript 和 CSS 校验需要用到的 JS 引擎（这里用的是 Node.js）的安装路径。


（3）JSHint 选项


　　SublimeLinter 使用 JSHint 作为默认的 JavaScript 校验器，也可以配置为 jslint 和 gjslint（closure linter）。下面我使用的 jshint 校验选项，大家可以根据自己的编码风格自行配置，​



"jshint_options":
    {
        "strict": true,
        "noarg": true,
        "noempty": true,
        "eqeqeq": true,
        "undef": true,
        "curly": true,
        "forin": true,
        "devel": true,
        "jquery": true,
        "browser": true,
        "wsh": true,
        "evil": true
    }


（4）CSSLint 选项


　　SublimeLinter 使用 CSSLint 作为 CSS 的校验器，下面是默认配置的校验选项，可以根据个人编码风格修改：



"csslint_options":
    {
        "adjoining-classes": "warning",
        "box-model": true,
        "box-sizing": "warning",
        "compatible-vendor-prefixes": "warning",
        "display-property-grouping": true,
        "duplicate-background-images": "warning",
        "duplicate-properties": true,
        "empty-rules": true,
        "errors": true,
        "fallback-colors": "warning",
        "floats": "warning",
        "font-faces": "warning",
        "font-sizes": "warning",
        "gradients": "warning",
        "ids": "warning",
        "import": "warning",
        "important": "warning",
        "known-properties": true,
        "outline-none": "warning",
        "overqualified-elements": "warning",
        "qualified-headings": "warning",
        "regex-selectors": "warning",
        "rules-count": "warning",
        "shorthand": "warning",
        "star-property-hack": "warning",
        "text-indent": "warning",
        "underscore-property-hack": "warning",
        "unique-headings": "warning",
        "universal-selector": "warning",
        "vendor-prefix": true,
        "zero-units": "warning"
    }