1. 我的主题
主题1：Ksix
主题2：Boxy
- UI用了Boxy的UI：
Boxy Ocean.sublime-theme - 代码颜色用了Ksix的：
Packages/Theme - Ksix/Ksix.tmTheme - 相关配置看下面的 **我的配置 **
2. 我自己的配置
Perferences->Settings - User
{
"auto_complete": true, /* 代码提示 */
"auto_match_enabled": false, /* 自动匹配引号，括号等，即按了一个"，就自动出现另外一个 */
"color_scheme": "Packages/Theme - Ksix/Ksix.tmTheme", /* theme */
"draw_minimap_border": true, /* 右侧缩略图边框 */
"font_face": "YaHei Consolas Hybrid", /* 字体设置 */
"font_size": 13, /* 字体大小 */
"highlight_line": true, /* 当前行标亮 */
"ignored_packages": /* 开启vim模式 */
[
"Toggle Css Format"
],
"save_on_focus_lost": false, /* 失去焦点后保存 */
"show_encoding": true, /* 显示当前文件编码 */
"tab_size": 4, /* Tab键制表符宽度 */
"theme": "Boxy Ocean.sublime-theme", /* theme */
"translate_tabs_to_spaces": true, /* 设为true时，缩进和遇到Tab键时使用空格替代 */
"update_check": false, /* 关闭自动更新 */
"word_separators": "./\\()\"':,.;<>~!@#$%^&*|+=[]{}`~?", /* 双击选中中划线 */
"word_wrap": true, /* 强制换行 */
"wrap_width": 80, /* 超过80字符自动换行 */
"draw_white_space": "all" /* 显示空格，tab 换行等不可见字符 */
}
3. 小技巧
----多项目并行开发如何做到快速切换----
多项目并行开发如何做到快速切换——sublime Text3
注意：新建其它Project时，要在另外一个窗口中进行，不然会覆盖之前的Project
4. 好用插件
----Package Control----
这个就不多说，sublime Text3是自带的，安装、使用方法自行百度。
下面所有插件都要用这个安装的。
----Emment----
详细功能请看《Emmet：HTML/CSS代码快速编写神器》
修改 Emmet 兼容jsx 文件
打开 preferences -> Key bindings - Users，把下面代码复制到[]内部。
{
"keys": [
"super+e"
],
"args": {
"action": "expand_abbreviation"
},
"command": "run_emmet_action",
"context": [{
"key": "emmet_action_enabled.expand_abbreviation"
}]
},
{
"keys": ["tab"],
"command": "expand_abbreviation_by_tab",
"context": [{
"operand": "source.js",
"operator": "equal",
"match_all": true,
"key": "selector"
}, {
"key": "preceding_text",
"operator": "regex_contains",
"operand": "(\\b(a\\b|div|span|p\\b|button)(\\.\\w*|>\\w*)?([^}]*?}$)?)",
"match_all": true
}, {
"key": "selection_empty",
"operator": "equal",
"operand": true,
"match_all": true
}]
}
```
***
### ----Terminal----
> 在Sublime中直接使用终端打开你的项目文件夹，并支持使用快捷键。
***
### ----SVG-Snippets----
[SVG-Snippets](https://github.com/jorgeatgu/SVG-Snippets)
> 设置自定义的SVG片段
***
### ----ColorPicker----
> 取色器
***
### ----jade----
> jade语法高亮
***
### ----DocBlockr----
> **用于快速书写注释，以及规范注释**，详细内容见链接：
[DocBlockr与javascript注释规范](http://www.ithao123.cn/content-719950.html)
***
### ----Autoprefixer----
> CSS3前缀自动补全，需要安装[nodejs](https://nodejs.org/en/)，详细用法以及配置见链接：
[如何处理CSS3属性前缀](http://www.w3cplus.com/css3/autoprefixer-css-vender-prefixes.html)
***
### ----Block Cursor----
> 改成vim编辑模式，将光标所在的字符高亮，而不是默认的在字符下呈下划线
***
### ----MarkdownEditing，OmniMarkupPreviewer----
> 在sublime书写Markdown，详细用法和配置见链接：
[近乎完美的 Markdown 写作体验 - Sublime Text 3 + OmniMarkupPreviewer](http://blog.leanote.com/post/54bfa17b8404f03097000000)
[Sublime Text 3下两款Markdown插件](http://www.linuxidc.com/Linux/2015-08/121178.htm)
[Sublime插件：Markdown篇](http://www.jianshu.com/p/aa30cc25c91b)
***
### ----ReactJS----
> React函数自动补充，用法见链接：
[sublime-react](https://github.com/facebookarchive/sublime-react)
**补充：**
上述链接说此包不提供语法高亮，建议使用[babel-sublime](https://github.com/babel/babel-sublime)
***
### ----babel-sublime----
> Language definitions for [ES6+ JavaScript](http://kangax.github.io/compat-table/es6/) with [React JSX syntax](http://facebook.github.io/react/docs/jsx-in-depth.html) extensions.
**详细用法见链接：**
[babel-sublime](https://github.com/babel/babel-sublime)
***
### ----HTML-CSS-JS Prettify----
> 格式化HTML、CSS、JS，详细用法见链接（或者看看下面的简单摘要）：
[使用Sublime Text 3的HTML-CSS-JS Prettify插件格式化代码](https://segmentfault.com/a/1190000000666502)
#### 简单摘要
如果出现下面的错误：
鼠标右键`HTML/CSS/JS Prettify` > `Set Plugin Options`保证插件路径与Node.js安装路径一致，Ctrl+s保存。**(如下：我的nodejs安装在`D:/software/nodejs/node.exe`)**
{
// Simply using node without specifying a path sometimes doesn't work :(
// https://github.com/victorporof/Sublime-HTMLPrettify#oh-noez-command-not-found
// http://nodejs.org/#download
"node_path": {
"windows": "D:/software/nodejs/node.exe",
"linux": "/usr/bin/nodejs",
"osx": "/usr/local/bin/node"
},
// Automatically format when a file is saved.
"format_on_save": false,
// Only format the selection if there's one available.
"format_selection_only": true,
// Log the settings passed to the prettifier from .jsbeautifyrc.
"print_diagnostics": true
}
***
### ----IMESupport----
> 这个插件可以在中文输入时，候选词的位置跟随光标
***
### ----Sass语法高亮----
> Sass语法高亮
安装完之后，如果右下角没有改成sass就手动把它该过来吧
1. Backet HighLight
> 这个插件可以高亮引号、括号等**
**注：要有效果，需要配置该插件的配置文件，**
其配置文件（Backet Setting-User）如下：
{
//Debug logging
"debug_enable": false,
// When only either the left or right bracket can be found
// this defines if the unmatched bracket should be shown.
"show_unmatched": true,
// Do the opposite of "show_unmatched" for the languages listed below
"show_unmatched_exceptions": [],
// Enable high visibility by default when sublime starts up
// If sublime is already running and this gets changed,
// you will not see any changes (restart required to see change)
"high_visibility_enabled_by_default": false,
// Experimental: Creates a visible bar at the beginning of all lines between
// multiline bracket spans.
"content_highlight_bar": false,
// Experimental: Align the content highlight bar at the bracket indent level
"align_content_highlight_bar": false,
// Show brackets in the minimap.
// Depending on your highlight style, regions may not be visible in minimap.
// "underline" won't show up due to it being a style consisting of
// multiple zero width selections to create a fat underline.
// But the following styles should show up fine as they are normal regions styles:
// - thin_underline
// - solid
// - outline
// - squiggly
// - stippled
"show_in_minimap": false,
// High visibility style and color for high visibility mode
// (solid|outline|underline)
// ST3 has additional options of (thin_underline|squiggly|stippled)
"high_visibility_style": "outline",
// (scope|__default__|__bracket__)
"high_visibility_color": "__bracket__",
// Match brackets only when the cursor is touching the inside of the bracket
"match_only_adjacent": false,
// Outside adjacent bracket matching
"bracket_outside_adjacent": true,
// EXPERIMENTAL: Special matching mode for block cursor.
// Essentially, this provides a matching mode that makes a little more
// sense to some in regards to the visual representation of block cursors.
// This will ignore "bracket_outside_adjacent".
"block_cursor_mode": false,
// When "bracket_outside_adjacet" is set, and a plugin command explicitly sets
// "no_outside_adj" to "None" instead of "true" or the default "false",
// this value will be used.
"ignore_outside_adjacent_in_plugin": true,
// When "block_cursor_mode" is set, and a plugin command explicitly sets
// "no_block_mode" to "None" instead of "true" or the default "false",
// this value will be used.
"ignore_block_mode_in_plugin": true,
// Character threshold to search
"search_threshold": 5000,
// Ignore threshold
"ignore_threshold": false,
// Set mode for string escapes to ignore (regex|string)
"bracket_string_escape_mode": "string",
// Set max number of multi-select brackets that will be searched automatically
"auto_selection_threshold" : 10,
// Enable this to completely kill highlighting if "auto_selection_threshold"
// is exceeded. Default is to highlight up to the "auto_selection_threshold".
"kill_highlight_on_threshold": true,
// Disable gutter icons when doing multi-select
"no_multi_select_icons": false,
// Rules that define the finding and matching of brackets
// that are contained in a common scope.
// Useful for bracket pairs that are the same but
// share a common scope. Brackets are found by
// Finding the extent of the scope and using regex
// to look at the beginning and end to identify bracket.
// Use only if they cannot be targeted with traditional bracket
// rules.
"scope_brackets": [
// Quotes
{
"name": "py_single_quote",
"open": "(?:u|b)?r?((?:'')?')",
"close": "((?:'')?')",
"style": "single_quote",
"scopes": ["string"],
"language_filter": "whitelist",
"language_list": [
"Python",
"PythonImproved",
"MagicPython"
],
"sub_bracket_search": "true",
"plugin_library": "bh_modules.pyquotes",
"enabled": true
},
{
"name": "py_double_quote",
"open": "(?:u|b)?r?((?:\"\")?\")",
"close": "((?:\"\")?\")",
"style": "double_quote",
"scopes": ["string"],
"language_filter": "whitelist",
"language_list": [
"Python",
"PythonImproved",
"MagicPython"
],
"sub_bracket_search": "true",
"plugin_library": "bh_modules.pyquotes",
"enabled": true
},
{
"name": "single_quote",
"open": "(')",
"close": "(')",
"style": "single_quote",
"scopes": ["string", "string.quoted"],
"language_filter": "blacklist",
"language_list": ["Plain text", "Hex"],
"sub_bracket_search": "true",
"enabled": true
},
{
"name": "double_quote",
"open": "(\")",
"close": "(\")",
"style": "double_quote",
"scopes": ["string", "string.quoted"],
"language_filter": "blacklist",
"language_list": ["Plain text", "Hex"],
"sub_bracket_search": "true",
"enabled": true
},
// Regex for different Languages
{
"name": "jsregex",
"open": " *(/)",
"close": "(/)[igm]*",
"style": "regex",
"scopes": ["string"],
"language_filter": "whitelist",
"language_list": ["JavaScript"],
"sub_bracket_search": "true",
"enabled": true
},
{
"name": "perlregex",
"open": "(?:m|s|tr)(.|\n)",
"close": "(.|\n)(?:[igmos]*)",
"style": "regex",
"scopes": ["string.regexp"],
"language_filter": "whitelist",
"language_list": ["Perl"],
"sub_bracket_search": "true",
"enabled": true
},
{
"name": "rubyregex",
"open": " *(/)",
"close": "(/)[imxo]*",
"style": "regex",
"scopes": ["string"],
"language_filter": "whitelist",
"language_list": ["Ruby", "RSpec", "Better RSpec"],
"sub_bracket_search": "true",
"enabled": true
},
// Markdown
{
"name": "mditalic",
"open": "(\\*|_)",
"close": "(\\*|_)",
"style": "default",
"scopes": ["markup.italic"],
"language_filter": "whitelist",
"language_list": ["Markdown", "Multimarkdown", "GithubFlavoredMarkdown"],
"sub_bracket_search": "true",
"enabled": true
},
{
"name": "mdbold",
"open": "(\\*\\*|__)",
"close": "(\\*\\*|__)",
"style": "default",
"scopes": ["markup.bold"],
"language_filter": "whitelist",
"language_list": ["Markdown", "Multimarkdown", "GithubFlavoredMarkdown"],
"sub_bracket_search": "true",
"enabled": true
},
{
"name": "mdcodeinline",
"open": "(`+)",
"close": "(`+)",
"style": "default",
"scopes": ["markup.raw.inline.markdown"],
"language_filter": "whitelist",
"language_list": ["Markdown", "Multimarkdown", "GithubFlavoredMarkdown"],
"sub_bracket_search": "true",
"plugin_library": "bh_modules.mdcode",
"enabled": true
},
{
"name": "mdcodeblock",
"open": "\\s*(`{3,}|~{3,})",
"close": "(`{3,}|~{3,})\\n?",
"style": "default",
"scopes": ["markup.raw.block.fenced.markdown, markup.raw.block.markdown.fenced"],
"language_filter": "whitelist",
"language_list": ["Markdown", "Multimarkdown", "GithubFlavoredMarkdown"],
"plugin_library": "bh_modules.mdcode",
"sub_bracket_search": "true",
"enabled": true
},
// LaTeX
{
"name": "latexmath_inline",
"open": "(\\$)",
"close": "(\\$)",
"style": "default",
"scopes": ["string.other.math.tex"],
"language_filter": "whitelist",
"language_list": ["LaTeX", "LaTeX (TikZ)", "knitr (Rnw)"],
"sub_bracket_search": "true",
"enabled": true
}
],
// Rule definitions for finding and matching brackets.
// Brackets are found by using regex and can use scope
// qualifiers exclude certain matches.
// Once all matches are found, the closest pair surrounding
// the cursor are selected.
"brackets": [
// Basic brackets
{
"name": "curly",
"open": "(\\{)",
"close": "(\\})",
"style": "curly",
"scope_exclude": ["string", "comment", "source.yaml-tmlanguage constant.character.escape"],
"scope_exclude_exceptions": ["text.tex string.other.math"],
"language_filter": "blacklist",
"language_list": ["Plain text", "Hex"],
"find_in_sub_search": "true",
"ignore_string_escape": true,
"enabled": true
},
{
"name": "round",
"open": "(\\()",
"close": "(\\))",
"style": "round",
"scope_exclude_exceptions": [
"text.tex string.other.math",
"punctuation.definition.string.begin.shell",
"punctuation.definition.string.end.shell"
],
"scope_exclude": [
"string",
"comment",
"punctuation.definition.case-pattern.shell",
"source.yaml-tmlanguage constant.character.escape"
],
"language_filter": "blacklist",
"language_list": ["Plain text", "Hex", "RTF"],
"find_in_sub_search": "true",
"ignore_string_escape": true,
"enabled": true
},
{
"name": "square",
"open": "(\\[)",
"close": "(\\])",
"style": "square",
"scope_exclude": ["string", "comment"],
"scope_exclude_exceptions": ["text.tex string.other.math", "source.yaml-tmlanguage meta.value -constant.character.escape"],
"language_filter": "blacklist",
"language_list": ["Plain text", "Hex", "RTF"],
"find_in_sub_search": "true",
"ignore_string_escape": true,
"enabled": true
},
// PHP Angle
{
"name": "php_angle",
"open": "(<\\?)(?:php)?",
"close": "(\\?>)",
"style": "angle",
"scope_exclude": ["string", "comment", "keyword.operator"],
"language_filter": "whitelist",
"language_list": ["HTML", "HTML 5"],
"enabled": true
},
// Angle
{
"name": "angle",
"open": "(<)(?=[^?%]|$)",
"close": "(?:(?<=[^?%])|(?<=^))(>)",
"style": "angle",
"scope_exclude": [
"string",
"comment",
"keyword.operator",
"source.ruby.rails.embedded.html",
"source.ruby.embedded.html"
],
"language_filter": "whitelist",
"language_list": [
"HTML",
"HTML 5",
"XML",
"PHP",
"HTML (Rails)",
"HTML (Jinja Templates)",
"HTML (Twig)",
"HTML (Django)",
"HTML+CFML",
"ColdFusion",
"ColdFusionCFC",
"laravel-blade",
"Handlebars",
"AngularJS",
"Java Server Pages (JSP)"
],
"plugin_library": "bh_modules.tags",
"enabled": true
},
// CSSedit groups
{
"name": "cssedit_groups",
"open": "(/\\* *@group .*\\*/)",
"close": "(/\\* *@end *\\*/)",
"style": "default",
"scope_exclude": [],
"language_filter": "whitelist",
"language_list": ["CSS"],
"enabled": true
},
// Ruby embedded HTML
{
"name": "ruby_embedded_html",
"open": "((?:(?<=<%)|(?<=^)|(?<==)|(?<=<<))\\s*\\b(?:if|begin|case)\\b(?!:)|(?:(?<=<%)|(?<=^))\\s*\\b(?:for|until|unless|while|class|module|def\\b[\\p{Ll}\\p{Lu}]*)\\b(?!:)|(?<!:)\\bdo\\b(?!:))",
"close": "(?<=[\\s;])(end)\\b(?!:)",
"style": "default",
"scope_exclude": ["text.html", "source", "comment", "string"],
"scope_exclude_exceptions": [
"source.ruby.rails.embedded.html",
"source.ruby.embedded.html"
],
"plugin_library": "bh_modules.rubykeywords",
"language_filter": "whitelist",
"language_list": ["HTML", "HTML 5", "PHP", "HTML (Rails)"],
"enabled": true
},
// Ruby conditional statements
{
"name": "ruby",
"open": "((?:(?<=^)|(?<==)|(?<=<<))\\s*\\b(?:if|begin|case)\\b(?!:)|^\\s*\\b(?:for|until|unless|while|class|module|def\\b[\\p{Ll}\\p{Lu}]*)\\b(?!:)|(?<!:)\\bdo\\b(?!:))",
"close": "(?<=[\\s;])(end)\\b(?!:)",
"style": "default",
"scope_exclude": ["string", "comment"],
"plugin_library": "bh_modules.rubykeywords",
"language_filter": "whitelist",
"language_list": ["Ruby", "RSpec", "Better RSpec", "Ruby on Rails"],
"enabled": true
},
// C/C++ compile switches
{
"name": "c_compile_switch",
"open": "(\\#(?:if|ifdef|ifndef))\\b",
"close": "(\\#endif)\\b",
"style": "c_define",
"scope_exclude": ["string", "comment"],
"language_filter": "whitelist",
"language_list": ["C++", "C", "Objective-C", "CCpp", "C Improved"],
"enabled": true
},
// PHP conditional keywords
{
"name": "php_keywords",
"open": "(?:^\\s*|<\\?(?:php)?\\s*)?\\b(if|foreach|for|while|switch)\\b(?=.*:\\s*(?:\\?>\\s*)?$)",
"close": "(?:^\\s*|<\\?(?:php)?\\s*)?\\b(endif|endfor|endforeach|endwhile|endswitch)\\b(?=\\s*;\\s*(?:\\?>\\s*)?$)",
"style": "default",
"language_filter": "whitelist",
"scope_exclude": ["string", "comment"],
"plugin_library": "bh_modules.phpkeywords",
"language_list": [
"HTML",
"HTML 5",
"XML",
"PHP",
"HTML+CFML",
"ColdFusion",
"ColdFusionCFC"
],
"enabled": true
},
// Erlang conditional statements
{
"name": "erlang",
"open": "\\s*(\\b(?:if|case|begin|try|fun(?=\\s*\\()|receive)\\b)",
"close": "\\b(end)\\b",
"style": "default",
"scope_exclude": ["string", "comment"],
"language_filter": "whitelist",
"plugin_library": "bh_modules.lowercase",
"language_list": ["Erlang", "HTML (Erlang)"],
"enabled": true
},
//Bash
{
"name": "bash",
"open": "(?:(?<!\\\\\\n)(?:;|^|&|\\|)\\s*)\\b(if|case|while|select|until|for)\\s",
"close": "(?:(?<!\\\\\\n)(?:;|^)\\s*)\\b(fi|esac|done)(?=;|\\s|$)",
"style": "default",
"scope_exclude": ["string", "comment"],
"plugin_library": "bh_modules.bashsupport",
"language_filter": "whitelist",
"language_list": ["Shell-Unix-Generic"],
"enabled": true
},
//Fish shell
{
"name": "fish",
"open": "(?:(?<!\\\\\\n)(?:;|^|&|\\||and|or|not)\\s*)\\b(begin|if|while|for|switch|function)(?:;|\\s)",
"close": "(?:(?<!\\\\\\n)(?:;|^)\\s*)\\b(end)(?=;|\\s|$)",
"style": "default",
"scope_exclude": ["string", "comment"],
"language_filter": "whitelist",
"language_list": ["fish"],
"enabled": true
},
// Lua
{
"name": "lua",
"open": "(?<=[\\s;])(if|while|function|do|repeat)\\b",
"close": "(?<=[\\s;])(end|until)\\b",
"style": "default",
"scope_exclude": ["string", "comment"],
"plugin_library": "bh_modules.luakeywords",
"language_filter": "whitelist",
"language_list": ["Lua"],
"enabled": true
},
// LaTeX
{
"name": "latexenv",
"open": "(\\\\begin{[^}]*})",
"close": "(\\\\end{[^}]*})",
"style": "tag",
"scope_exclude": ["comment"],
"plugin_library": "bh_modules.latexenvironments",
"language_filter": "whitelist",
"language_list": ["LaTeX", "LaTeX (TikZ)", "knitr (Rnw)"],
"sub_bracket_search": "true",
"enabled": true
},
// Pascal
{
"name": "pascal",
"open": "(?:(?<=^)|(?<=[\\s;]))(try|(?<=\\=\\s)(?:class|record|interface)|begin|repeat)\\b",
"close": "(?<=[\\s;])(end(?=[;\\s])|until(?=\\s))",
"style": "default",
"scope_exclude": ["string", "comment"],
"plugin_library": "bh_modules.pascalkeywords",
"language_filter": "whitelist",
"language_list": ["Pascal"],
"enabled": true
},
// Elixir
{
"name": "elixir",
"open": "\\b(do$|fn)\\b",
"close": "\\b(end)\\b",
"style": "default",
"scope_exclude": ["string", "comment"],
"language_filter": "whitelist",
"language_list": ["Elixir"],
"enabled": true
}
],
// user_scope_brackets and user_brackets will be appended
// to the tail of scope_brackets and brackets respectively
// If you have custom rules that you don't want to commit to
// the official list, and do not need to be inserted before
// one of the official definitions, this is a good place to
// put yours rules and keep in sync with the defaults.
"user_scope_brackets": [],
"user_brackets": [],
// Define region highlight styles
"bracket_styles": {
// "default" and "unmatched" styles are special
// styles. If they are not defined here,
// they will be generated internally with
// internal defaults.
// "default" style defines attributes that
// will be used for any style that does not
// explicitly define that attribute. So if
// a style does not define a color, it will
// use the color from the "default" style.
"default": {
"icon": "dot",
// BH1's original default color for reference
// "color": "entity.name.class",
"color": "brackethighlighter.default",
"style": "hightlight"
},
// This particular style is used to highlight
// unmatched bracket pairs. It is a special
// style.
"unmatched": {
"icon": "question",
"color": "brackethighlighter.unmatched",
"style": "hightlight"
},
// User defined region styles
"curly": {
"icon": "curly_bracket",
"color": "brackethighlighter.curly",
"style": "hightlight"
},
"round": {
"icon": "round_bracket",
"color": "brackethighlighter.round",
"style": "hightlight"
},
"square": {
"icon": "square_bracket",
"color": "brackethighlighter.square",
"style": "hightlight"
},
"angle": {
"icon": "angle_bracket",
"color": "brackethighlighter.angle",
"style": "hightlight"
},
"tag": {
"icon": "tag",
"color": "brackethighlighter.tag",
"style": "underline"
},
"c_define": {
"icon": "hash",
"color": "brackethighlighter.c_define",
"style": "hightlight"
},
"single_quote": {
"icon": "single_quote",
"color": "brackethighlighter.quote",
"style": "hightlight"
},
"double_quote": {
"icon": "double_quote",
"color": "brackethighlighter.quote",
"style": "hightlight"
},
"regex": {
"icon": "regex",
"color": "brackethighlighter.quote",
"style": "hightlight"
}
}
}
网友评论