Sublime Text 经常使用设置

sublime - 主题 Setting - User

编写代码质量的提高、是由于好的Theme潜移默化的结果
Material Theme 主题设置

//  Other available theme options:
//  其余可用的主题选项:
"material_theme_small_tab" : true , // Set Set small tabs （标题高度紧缩）
"material_theme_disable_fileicons" : true , // Hide siderbar file type icons （隐藏siderBar的文件类型Icon）
"material_theme_disable_folder_animation" : true , // Disable folder animation （ stop siderBar 文件夹动画效果）
"material_theme_small_statusbar" : true , // Set small status bar （设置左下角状态栏）
"material_theme_compact_sidebar" : true , // Set compact side bar （sideBar紧缩）
"material_theme_disable_tree_indicator" : true , // Disable sidebar file indicator （禁用sideBar文件指针）
"material_theme_bold_tab" : true , // Make the tab labels bolder （标题字体加粗）
"material_theme_tabs_separator" : true , // Show tabs separator, this disable tab animation hover （禁止Title动画、添加分割符）
/* changes提示颜色 */
"material_theme_accent_lime" : true , // set green lime accent color （酸橙色、绿黄色）
"material_theme_accent_purple" : true , // set purple accent color （紫色）
"material_theme_accent_red" : true , // set pale red accent color（红色） 
"material_theme_accent_orange" : true , // set orange accent color （橙色）
"material_theme_accent_yellow" : true , // set yellow accent color （黄色）
"material_theme_accent_indigo" : true , // set indigo accent color （靛蓝色）
"material_theme_panel_separator" : true , // show bottom panel separator （显示分离器底部面板）
"material_theme_tabs_autowidth" : true , // Enable autowidth for tabs （启用autowidth标签）
"material_theme_contrast_mode" : true , // Enable sidebar and panels contrast mode （slideBar 和 main背景对比度）
"material_theme_tree_headings" : true , // Show siderbar headings（显示siderbar标题）
//  Recommended UI and font settings for a better experience:
//  Material Theme 推荐的UI和字体设置
{
"overlay_scroll_bars": "enabled", //（水平垂直滚动条：system和disabled为默认显示方式，enabled为自动隐藏显示）
"line_padding_top": 3, //（设置每一行到顶部的距离PX）
"line_padding_bottom": 3, //（设置每一行到底部的距离PX）
"always_show_minimap_viewport": true, //（老是显示迷你地图窗口）
"bold_folder_labels": true, //（slideBar文件夹加粗）
"indent_guide_options": [ "draw_normal", "draw_active" ], // Highlight active indent（制表位的对齐白线，draw_normal为一直显示，draw_active为只显示当前光标所在的代码控制域）
"font_options": [ "gray_antialias" ], // For retina Mac（视网膜Mac）
}

Theme - Soda 主题地址
Theme - Soda 官网
Theme 语法高亮的配色方案 - 下载

"theme": "Soda Light 3.sublime-theme",
"theme": "Soda Dark 3.sublime-theme",
// 配色方案( 打开Sublime Text 3 -> Packages -> User  把下载的文件复制进去 )
在Preferences -> Color Scheme -> User这里设置一下对应的color theme就能够了
"color_scheme": "Packages/User/Monokai Soda.tmTheme",
"color_scheme": "Packages/User/Espresso Soda.tmTheme",

"soda_folder_icons": true   //（Icons设置为文件夹style、侧边栏文件夹图标、默认箭头）
"soda_classic_tabs": true   // set弧形标签的风格、默认是显示方形标签风格

Sublime - 配色方案

colorsublime 自定义主体颜色(Ctrl + Shift + P -> Colorsublime: Install Theme)
Abyss\Aurora\Metropolis\Nouba\Dracula

Sublime - 用户设置

// 主题设置
    "theme": "Material-Theme.sublime-theme",
    "color_scheme": "Packages/Material Theme/schemes/Material-Theme.tmTheme",
    "material_theme_small_tab": true,
    "material_theme_small_statusbar": true,
    "material_theme_compact_sidebar": true,
    "material_theme_bold_tab": true,
    "material_theme_tabs_separator": true,
    "material_theme_accent_yellow": true,
    // 光标
    "caret_extra_width": 2,
    "caret_style": "phase",
    "caret_extra_bottom": 3,
    "caret_extra_top": 3,
    // 基础设置
    "draw_minimap_border": true,// 预览窗口添加边框
    "save_on_focus_lost": true,// 失焦当即保存
    "trim_trailing_white_space_on_save": true,// 自动移除行尾多余空格
    "ensure_newline_at_eof_on_save": true,// 文件末尾自动保留一个空行
    "highlight_line": true,// 当前行高亮
    "highlight_modified_tabs": true,// 高亮未保存文件
    "ignored_packages": ["Vintage"],// 忽略VIM的支持\去掉Vinage开启vim模式
    "show_encoding": true,// 窗口右下角显示打开文件的编码
    "translate_tabs_to_spaces": true,// 代码 tab 对齐转换为空格对齐
    "word_wrap": true,// 自动换行
    "tab_size": 2,// Tab键制表符宽度
    "default_line_ending": "unix",// 使用 unix 风格的换行符。
    "overlay_scroll_bars": "enabled",// 滚动条自动隐藏显示
    "bold_folder_labels": true,// 侧边栏文件夹显示加粗
    "fade_fold_buttons": false,// 显示行号右侧的代码段闭合展开三角号
    // AutoFileName
    "auto_complete_triggers":
    [
      {
         "characters": "<",
         "selector": "text.html"
      },
      {
         "characters": "/",
         "selector": "string.quoted.double.html,string.quoted.single.html, source.css"
      }
    ]
    // With this, there's no need to worry about pressing ctrl+space, autocompletion with appear upon pressing /.

Sublime - 插件推荐

必备

• Package Control  插件管理
• Emmet 快速编写html

JavaScript

• SublimeLinter 代码检查框架
• SublimeLinter-csslint css检测
• SublimeLinter-jshint js检测插件
• SublimeCodeIntel 代码提示插件
• JsFormat javascript 格式化
• DocBlockr JavaScript代码注释
• jQuery jQuery

CSS

• CSS3 CSS3语言提示插件
• CSS Format CSS序列化插件:普通Expanded、紧凑Compact、压缩Compressed
• SASS 语法高亮、提示

HTML

• HTML5

Other 插件

• FileHeader 模板插件
• DocBlockr 脚本开头注释
• QuoteHTML HTML拼接js插入字符串、ctrl/cmd + space + P 打开控制面板，选择 Quote HTML
• Alignment 自动对齐代码
• SideBarEnhancements 侧边栏加强

AutoFileName 自动补全路径
Clipboard Manager 加强型剪贴板,可访问历史剪贴板记录
HTML-CSS-JS Prettify 格式化(Ctrl + Shift + H) 两格式化插件功能相互补充
BufferScroll 代码折叠状态保留
PackageResourceViewer 插件修改必备，ctrl+shift+p 调用 Open Resource
TortoiseSVN
AutoPrefixer 浏览器私有属性前缀补全
LiveStyle 双向更改无刷新实时预览(艾米特、中文翻译过来挺有意思的)
TrailingSpaces，多余空格标记，强迫症患者福音( "trim_trailing_white_space_on_save": true,// 自动移除行尾多余空格 )
colorsublime 自定义主体颜色(Ctrl + Shift + P -> Colorsublime: Install Theme)

为何使用csslint
SUBLIMETEXT3系列（2）-使用SUBLIMELINTER检查JAVASCRIPT与CSS代码
"use strict"在jshint报错
Doc​Blockr 开头注释

SublimeCodeIntel 参数配置( Preferences->Package Settings->SublimeCodeIntel->Setting Default )

"codeintel_selected_catalogs": [
  "HTML5", "HTML", "JavaScript"
],

Alignment 参数配置

{
    // If the indent level of a multi-line selection should be aligned
    "align_indent": true,
    // true  : 一、选中多行;二、缩进(若选中行不对其的话);三、自动对齐(根据 alignment_chars)
    // false : 只是对齐、不改变缩进方式

    // If indentation is done via tabs, set this to true to also align
    // mid-line characters via tabs. This may cause alignment issues when
    // viewing the file in an editor with different tab width settings. This
    // will also cause multi-character operators to be left-aligned to the
    // first character in the operator instead of the character from the
    // "alignment_chars" setting.
    "mid_line_tabs": false,
    // true  : 若文本的缩进方式为Tab缩进排版、则插件在对齐排版的时候也是用Tab方式(Sublime的Tab缩进为4个空格)
    // false : 默认(空格)

    // The mid-line characters to align in a multi-line selection, changing
    // this to an empty array will disable mid-line alignment
    "alignment_chars": ["=",":"],
    // 对齐字符、设置依据什么对齐 默认只对齐”=”

    // If the following character is matched for alignment, insert a space
    // before it in the final alignment
    "alignment_space_chars": ["=",":"],
    // 是"alignment_chars"的超级、若这里包含上面那些字符 则对齐后 = 号前面会加一个空格 反之 则没有

    // The characters to align along with "alignment_chars"
    // For instance if the = is to be aligned, there are a number of
    // symbols that can be combined with the = to make an operator, and all
    // of those must be kept next to the = for the operator to be parsed
    "alignment_prefix_chars": [
        "+", "-", "&", "|", "<", ">", "!", "~", "%", "/", "*", "."
    ]
}
// 对齐快捷键与QQ截图冲突
// 打开 Preferences=>Package Settings=>Alignment=>Key Bindding - User而后写入
// [{ "keys": ["super+ctrl+s"], "command": "alignment" }] // Mac
// [{ "keys": ["ctrl+alt+s"], "command": "alignment" }] // Win

SideBarEnhancements 参数设置
// 点击菜单栏的preferences->package setting->side bar->Key Building-User

//Chrome
    { "keys": ["f1"], "command": "side_bar_files_open_with",
        "args": {
            "paths": [],
            "application": "C:\\Users\\Administrator\\AppData\\Local\\Google\\Chrome\\Application\\chrome.exe",
            "extensions":".*" //匹配任何文件类型
        }
    },
    //Firefox
    { "keys": ["f2"], "command": "side_bar_files_open_with",
        "args": {
            "paths": [],
            "application": "C:\\Program Files (x86)\\Mozilla Firefox\\firefox.exe",
            "extensions":".*"
        }
     },
    //iexplore
    { "keys": ["f3"], "command": "side_bar_files_open_with",
        "args": {
            "paths": [],
            "application": "C:\\Program Files\\Internet Explorer\\iexplore.exe",
            "extensions":".*"
        }
    },

Brackethighlighter 标签对标记
自定义标记颜色

// 打开Preferences -> package settings -> Bracket Highlighter -> Bracket Settings – User 添加以下代码：
{
    "bracket_styles": {
        "default": {
            "icon": "dot",
            // "color": "entity.name.class",
            "color": "brackethighlighter.default",
            "style": "highlight"
        },

        "unmatched": {
            "icon": "question",
            "color": "brackethighlighter.unmatched",
            "style": "highlight"
        },
        "curly": {
            "icon": "curly_bracket",
            "color": "brackethighlighter.curly",
            "style": "highlight"
        },
        "round": {
            "icon": "round_bracket",
            "color": "brackethighlighter.round",
            "style": "highlight"
        },
        "square": {
            "icon": "square_bracket",
            "color": "brackethighlighter.square",
            "style": "highlight"
        },
        "angle": {
            "icon": "angle_bracket",
            "color": "brackethighlighter.angle",
            "style": "highlight"
        },
        "tag": {
            "icon": "tag",
            "color": "brackethighlighter.tag",
            "style": "highlight"
        },
        "single_quote": {
            "icon": "single_quote",
            "color": "brackethighlighter.quote",
            "style": "highlight"
        },
        "double_quote": {
            "icon": "double_quote",
            "color": "brackethighlighter.quote",
            "style": "highlight"
        },
        "regex": {
            "icon": "regex",
            "color": "brackethighlighter.quote",
            "style": "outline"
        }
    }
}

FileHeader 文件模板 可自动更新修改时间

// New File Ctrl + Alt + N 新建文档
// Add Header Ctrl + Alt + A
// 新建文件夹？
{
    "Default": {
        "author":"ntscshen",
        "last_modified_by":"ntscshen",
        "email": "ntscshen@gmail.com"
    },
}

DocBlockr 代码注释补全工具

{
    "jsdocs_extra_tags":["@Author ntscshen","@Email ntscshen@gmail.com","@DateTime {{datetime}}"]
}

HTML补全修改

("a\tTag", "a href=\"javascript:;\">$0</a>"),
    ("iframe\tTag", "iframe src=\"$1\">$0</iframe>"),
    ("link\tTag", "link href=\"$1\" rel=\"stylesheet\" type=\"text/css\" />"),
    ("script\tTag", "script type=\"text/javascript\" src=\"$1\">$0</script>"),
    ("style\tTag", "style type=\"${1:text/css}\">$0</style>"),
    ("img\tTag", "img src=\"$1\" alt=\"$2\" />"),
    ("param\tTag", "param name=\"$1\" value=\"$2\">")

Sublime - 快捷键映射

[
    //Copy Path
    { "keys": ["ctrl+shift+c"], "command": "copy_path" },
    //js_format
    { "keys": ["ctrl+alt+f"], "command": "js_format", "context": [{"key": "selector", "operator": "equal", "operand": "source.javascript"}] },
    //set autoprefixer
    {
        "keys": ["ctrl+alt+shift+x"],"command":"autoprefixer"
    },
    //code提示
    // { "keys": ["alt+space"], "command": "auto_complete" },
    { "keys": ["alt+space"], "command": "auto_complete" },
    { "keys": ["alt+space"], "command": "replace_completion_with_auto_complete", "context":
      [
        { "key": "last_command", "operator": "equal", "operand": "insert_best_completion" },
        { "key": "auto_complete_visible", "operator": "equal", "operand": false },
        { "key": "setting.tab_completion", "operator": "equal", "operand": true }
      ]
    },
    //多文本粘贴
    { "keys": ["ctrl+c"], "command": "clipboard_manager_copy" },
    { "keys": ["ctrl+x"], "command": "clipboard_manager_cut" },
    { "keys": ["ctrl+v"], "command": "paste_and_indent" },
    { "keys": ["ctrl+shift+v"], "command": "clipboard_manager_choose_and_paste" },
    // 代码补全
    {"keys": ["alt+d"], "command": "code_intel_auto_complete" },
    // Quote HTML快捷键修改
    { "keys": ["ctrl+alt+'"],
    "command": "quote_html",
    "args": {"action": "single"}
    },
    //Chrome
    { "keys": ["f1"], "command": "side_bar_files_open_with",
        "args": {
            "paths": [],
            "application": "C:\\Users\\Administrator\\AppData\\Local\\Google\\Chrome\\Application\\chrome.exe",
            "extensions":".*" //匹配任何文件类型
        }
    },
    //Firefox
    { "keys": ["f2"], "command": "side_bar_files_open_with",
        "args": {
            "paths": [],
            "application": "C:\\Program Files (x86)\\Mozilla Firefox\\firefox.exe",
            "extensions":".*"
        }
     },
    //iexplore
    { "keys": ["f3"], "command": "side_bar_files_open_with",
        "args": {
            "paths": [],
            "application": "C:\\Program Files\\Internet Explorer\\iexplore.exe",
            "extensions":".*"
        }
    },
]

快捷键

//经常使用类
    Ctrl + D ( 选择单词 ) 最经常使用的没有之一
    Ctrl + Enter ( 换行 ) 举个栗子：即便光标不在行尾，也能快速向下插入一行。
    Ctrl + K + B ( 切换侧边栏 )
    Ctrl + / （ 注释当前行 ）
    Ctrl + Shift + / ( 注释多行 )         --- com + option + /
    Ctrl + L  ( 选择行 )    最经常使用的是Ctrl + L + delete 虽然有Ctrl + x
    Ctrl + Shift + ↑↓ 替换行
    Ctrl + ← 以单词为间隔 光标向左移动    --- com + ←
    Ctrl + → 以单词为间隔 光标向右移动    --- com + →
    Home    ( 光标跳转当前行最前 )    --- com + ←
    End    ( 光标跳转当前行最前 )    --- com + →
    Tab ( 缩进 ) == Alt + [ == com + [
    Shift + tab ( 左缩进 ) == Alt + ] == com + ]
    Alt+Shift+2 ( 左右分屏 )
    Ctrl + M 快速在起始括号和结尾括号之间切换 --- con + m
    Ctrl + shift + M 快速选中括号间的内容 --- con + shift + m
    Ctrl + Alt + n ( 快速建立文件并添加到当前文件parent内 ) --- File Header插件提供 --- 不装插件只能新建保存等一堆麻烦的操做 以下↓
    Ctrl + n + Ctrl + s 输入文件名( 记得加后缀、否则须要Ctrl + Shift + P 搜索html或者其余格式进行切换。选择: Set Syntax: HTML )

    SideBarEnhancements侧边栏加强插件 : 设置F1 F2 F3默认打开不一样浏览器 --> 跳转 快捷键映射( 映射地址application为软件安装地址 )

    快速建立桌面文件夹( Win: Ctrl + Shift + n )
    桌面文件夹重命名快捷键( Win: F2;  Mac: enter )
    或zsh mkdir fileName  --> mv oldFileName newFileName

    ** Atom建立文件 **
    command + \ 切换侧边栏( 默认是选择当前文件 )
    上下箭头切换到当前文件
    按键盘a ( 输入文件名和后缀 ) --- 就这么简单
    建立文件夹 shift + a  --- 就这么简单


    //公式
    Ctrl + Shift + y (公式计算)
    Ctrl + ↕、Alt + ↕ (数字加减)
    Ctrl + Shift + F (查找并替换)
    //选择类
    Ctrl + Shift + M (选中当前括号内容,重复可选着括号自己)
    Ctrl + M (跳转括号位置)
    Ctrl + ↔ (快速移动光标)
    Ctrl + K + 2 (折叠all代码)
    Ctrl + k + J (展开all代码)
    //编辑类
    Ctrl + J (合并选中多行代码为一行、配合Ctrl+Shift+M使用)
    Ctrl + Shift + D (复制光标所在行、插入下一行)
    Ctrl + K + K (从光标处删除至代码结尾)
    Ctrl + Shift + K
    Shift + Delete (删除整行)
    Ctrl + Insert (复制一行到粘贴板)
    Ctrl + Shift + D (复制一行)
    Ctrl + K + U (转换大写)
    Ctrl + K + L (转换小写)
    Ctrl + T (左右字母互换)
    //搜索类
    Ctrl + F 打开底部搜索框，查找关键字
    Ctrl + P 打开搜索框、快速搜索文件
    Ctrl + G(:) 数字跳转
    Ctrl + R(@) 跳转函数名
    Ctrl + :(#) 查找变量名、属性名
    //显示类
    Ctrl + PageDown 切换到当前文件头部
    Ctrl + PageUp   切换到当前文件尾部
    Ctrl + 1        切换到第一屏

参考 - Sublime Text 3 调教你的私人利器
参考 - Sublime Text3插件以及配置集合