一、下载sublime text3
进入官方网站进行下载
二、安装插件
1. Package Control
作为安装 Sublime Text 插件的必备利器,Package Control 是这款编辑器的标配,可以方便开发人员快速安装需要的插件。Package Control分为命令行安装和下载安装包安装,详细流程见https://packagecontrol.io/installation
2. Emmet
Emmet 项目的前身是前端开发人员熟知的 Zen Coding(快速编写 HTML/CSS 代码的方案)。在 Sublime Text 编辑器中搭配 Emmet 插件真的是让你编码快上加快。
3. SublimeCodeIntel
SublimeCodeIntel 是一个代码提示、补全插件,支持多种语言,还能跳转到变量、函数定义的地方,十分方便。
默认js的提示为jquery,若需要支持其他的,可以将Preferences->Package Settings->SublimeCodeIntel->Setting Default,将其内容全部复制到Setting User中,并修改"codeintel_selected_catalogs": ["jQuery","HTML5", "HTML", "JavaScript"]
若需要额外配置,则需安装相应程序并把路径写入 ~/.codeintel/config 或 project_root.codeintel/configz中。详见packagecontrol。通过packet control下载安装好SublimeCodeInter插件之后,通过preference–>browse packages找到插件SublimeCodeInter的路径之后,找不到 .codeintel/config 目录解决方法:windows环境下通过cmd进入dos环境,使用mkdir .codeintel建立了一个名为“.codeintel”的文件夹,在.condeintel/config下面创建一个config配置文件,内容例如:
{
"PHP": {
"php": '/usr/bin/php',
"phpExtraPaths": [],
"phpConfigFile": 'php.ini'
},
"JavaScript": {
"javascriptExtraPaths": []//写上路径
}
}
4. HTML-CSS-JS Prettify
HTML-CSS-JS Prettify可用于格式化 HTML, CSS, JavaScript和JSON代码。使用该插件前需先安装node.js。安装好该插件后,点击Preferences->Package Settings->HTML-CSS-JS Prettify->Set Node Path设置node.js的安装路径。可参见
5. BracketHighlighter
BracketHighlighter这个插件功能是匹配括号,在行号前面可以看到匹配括号的位置。
6. SublimeLinter
SublimeLinter相当于一个插件容器,可以容纳许多linter插件,如SublimeLinter-jshint、SublimeLinter-csslint。进行代码检查的实际上是jshint与csslint这些代码检查工具。
安装SublimeLinter
将htmlhint、jshint与csslint三个模块安装到全局环境
在控制台运行:npm install -g htmlhint
和npm install -g jshint
和npm install -g csslint
。可通过输入csslint –version和jshint -v来确认csslint和jshint是否安装成功。使用Package Control安装SublimeLinter-contrib-htmlhint、SublimeLinter-jshint 与 SublimeLinter-csslint插件
配置文件
Preferences > Package Settings > SublimeLinter > Settings – User文件里面配置参数(若想修改错误提示的图形,可通过Tools-> SublimeLinter > Choose Gutter Theme… 进行修改,详见){ "user": { "sublimelinter": "save-only", "sublimelinter_popup_errors_on_save": true, "sublimelinter_executable_map": { "javascript": "D:/Program Files/nodejs/node.exe", "css": "D:/Program Files/nodejs/node.exe" }, "jshint_options": { "strict": false, "quotmark": "single", //只能使用单引号 "noarg": true, "noempty": true, //不允许使用空语句块{} "eqeqeq": true, //!==和===检查 "undef": true, "curly": true, //值为true时,不能省略循环和条件语句后的大括号 "forin": true, //for in hasOwnPropery检查 "devel": true, "jquery": true, "browser": true, "wsh": true, "evil": true, "unused": "vars", //形参和变量未使用检查 "latedef": true, //先定义变量,后使用 "globals": { "grunt": true, "module": true, "window": true, "jQuery": true, "$": true, "global": true, "document": true, "console": true, "setTimeout": true, "setInterval": true } }, "csslint_options": { "adjoining-classes": false, "box-sizing": false, "box-model": false, "compatible-vendor-prefixes": false, "floats": false, "font-sizes": false, "gradients": 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/Blueberry/cross/Blueberry - cross.gutter-theme", "gutter_theme_excludes": [], "lint_mode": "background", "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, "syntax_map": { "python django": "python", "pythonimproved": "python", "magicpython": "python", "html 5": "html", "html (django)": "html", "html (rails)": "html", "javascript (babel)": "javascript", "php": "html" }, "warning_color": "DDB700", "wrap_find": true } }