SublimeLinter是Sublime的一个代码检测工具插件。
下面安装SublimeLinter插件，使用SublimeLinter配置JS,CSS,HTML语法检查。将会安装以下四个插件：
SublimeLinter，SublimeLinter-contrib-htmlhint（html语法检查），SublimeLinter-csslint（css语法检查），SublimeLinter-jshint（js语法检查）
下面通过sublime插件控制台Package Control依次在Sublime Text3安装上诉四个插件。
在进行这些安装之前必须安装nodejs，因为这些工作实际上都是调用的Nodejs中的htmlhint，csslint和jshint。
一、安装 SublimeLinter
1. 打开Sublime，按下Ctrl+Shift+p进入 Command Palette；
2. 输入install进入 Package Control: Install Package；
3. 输入SublimeLinter，选择SublimeLinter进行安装。
二、安装 SublimeLinter-contrib-htmlhint
可以把sublimeLinter-contrib-htmlhint看成是SublimeLinter的一个插件，sublimeLinter-contrib-htmlhint调用htmlhint来进行语法检查。
1. 打开CMD命令窗口或者Node.js的CMD窗口输入命令npm install -g htmlhint安装htmlhint；
2. 在Sublime中按下Ctrl+Shift+p>输入pci安装插件>搜索SublimeLinter-contrib-htmlhint回车安装。
三、安装 jshint和csslint
1. 打开nodejs的CDM窗口安装jshint，csslint，输入命令安装npm install -g jshint csslint；
2. 在Sublime中按下Ctrl+Shift+p使用Package Control安装SublimeLinter-csslint和SublimeLinter-jshint。
四、配置文件
插件安装完之后需要给上诉插件编写配置文件，三种类型的文件的代码检查对应的配置文件名依次为：.htmlhintrc、.jshintrc、.csslintrc。三个配置文件需要放在工程目录的最顶层（至少应包含所有需要检测的代码文件），sublime会自动找到这些配置文件并使其生效。
也可以提供一个自定义的配置文件在args参数中设置，例如：
"args": ["--config", "C:\\Users\\Username\\htmlhint.conf"]
文件的名字可以随意定，只要内容配置htmlhint规则就可以。
具体的配置参数可参见github上对应项目，下面配置仅供参考：
.htmlhintrc
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
{ "tagname-lowercase":true, "attr-lowercase":true, "attr-value-double-quotes":true, "attr-value-not-empty":true, "attr-no-duplication":true, "doctype-first":false, "tag-pair":true, "tag-self-close":true, "spec-char-escape":true, "id-unique":true, "src-not-empty":true, "title-require":false, /*规范类*/ "doctype-html5":false, "id-class-value":false, "style-disabled":false, "inline-style-disabled":false, "inline-script-disabled":false, "space-tab-mixed-disabled":false, "id-class-ad-disabled":false, "href-abs-or-rel":false, "attr-unsafe-chars":false } |
.jshintrc
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 |
{ "curly": true, "eqeqeq": true, "forin": true, "freeze": true, // 全局变量需要手动加到配置文件的globals属性里 "globals": { }, "latedef": true, "maxerr": 200, "nonew": true, "shadow": "inner", "singleGroups": true, "undef": true, "unused": true, "evil": true, "expr": true, "proto": true, "scripturl": true, "sub": true, "browser": true, "devel": true, "jquery": true, "nonstandard": true, "typed": true, "worker": true } |
.csslintrc
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
{ "box-model": false, "adjoining-classes": false, "box-sizing": false, "compatible-vendor-prefixes": false, "gradients": false, "text-indent": false, "fallback-colors": false, "star-property-hack": false, "underscore-property-hack": false, "bulletproof-font-face": false, "font-faces": false, "import": false, "regex-selectors": false, "universal-selector": false, "unqualified-attributes": false, "overqualified-elements": false, "duplicate-background-images": false, "floats": false, "font-sizes": false, "ids": false, "important": false, "outline-none": false, "qualified-headings": false, "unique-headings": false } |
