准备工作
1.安装node.js
2.安装csslint,jshint
找到node.js comand prompt,输入以下命令
npm install csslint
npm install jshint
这两个就是实际起作用的组件。
安装sublimelinter
- ctrl+shift+p打开sublime Text 包管理面板输入pci选择package control install
- 输入sublimelinter,选择安装。(不建议将包直接丢进package里,麻烦实在太多)
- 重复1,2步输入sublimelinter-csslint,安装。
- 重复1,2步输入sublimelinter-jshint,安装。
进行设置
1.修改校验器的路径。
"sublimelinter_executable_map":
"javascript":"d:/program file/nodejs/node.exe",
"css":"d:/program file/nodejs/node.exe"
2.对校验选项选项进行修改,特别是css。下方为网上常用的设置。
{
"user": {
"csslint_options": {
"adjoining-classes": false,
"box-model": false,
"box-sizing": false,
"compatible-vendor-prefixes": false,
"duplicate-background-imges": false,
"floats": false,
"font-sizes": false,
"gradients": false,
"ids": false,
"important": false,
"known-properties": false,
"outline-none": false,
"qualified-headings": false,
"regex-selectors": false,
"shorthand": false,
"text-indent": false,
"unique-headings": false,
"universal-selector": false,
"unqualified-attributes": false
},
"debug": false,
"delay": 0.25,
"error_color": "D02000",
"gutter_theme": "Packages/SublimeLinter/gutter-themes/Default/Default.gutter-theme",
"gutter_theme_excludes": [],
"jshint_options": {
"browser": true,
"curly": true,
"devel": true,
"eqeqeq": true,
"evil": true,
"forin": true,
"globals": {
"$": true,
"console": true,
"document": true,
"global": true,
"grunt": true,
"jQuery": true,
"module": true,
"setInterval": true,
"setTimeout": true,
"window": true
},
"jquery": true,
"latedef": true,
"noarg": true,
"noempty": true,
"quotmark": "single",
"strict": false,
"undef": true,
"unused": "vars",
"wsh": true
},
"lint_mode": "save only",
"linters": {
"csslint": {
"@disable": false,
"args": [],
"errors": "",
"excludes": [],
"ignore": "",
"warnings": ""
},
"htmlhint": {
"@disable": true,
"args": [],
"excludes": []
},
"jshint": {
"@disable": true,
"args": [],
"excludes": []
}
},
"mark_style": "outline",
"no_column_highlights_line": false,
"passive_warnings": false,
"paths": {
"linux": [],
"osx": [],
"windows": []
},
"python_paths": {
"linux": [],
"osx": [],
"windows": []
},
"rc_search_limit": 3,
"shell_timeout": 10,
"show_errors_on_save": false,
"show_marks_in_minimap": true,
"sublimelinter": "save-only",
"sublimelinter_executable_map": {
"css": "C:/Program Files (x86)/nodejs/node.exe",
"html": "C:/Program Files (x86)/nodejs/node.exe",
"javascript": "C:/Program Files(x86)/nodejs/node.exe"
},
"sublimelinter_gutter_marks": true,
"sublimelinter_popup_errors_on_save": true,
"syntax_map": {
"html (django)": "html",
"html (rails)": "html",
"html 5": "html",
"javascript (babel)": "javascript",
"magicpython": "python",
"php": "html",
"python django": "python"
},
"warning_color": "DDB700",
"wrap_find": true
}
}
3.这个时候可能会发现对csslint单独设置的options并没有起到作用,虽然sulimelinter的官方文档也说了是有效的。不过可以使用ignore对warings进行忽略。
"csslint": {
"@disable": false,
"args": [],
"errors": "",
"excludes": [],
"ignore": [
"ids",
"box-model",
"box-sizing",
"universal-selector",
"duplicate-background-imges",
"adjoining-classes",
"text-indent"
],
"warnings": ""
},