Sublime 安装与配置

1、软件安装

Sublime Text 是一个代码编辑器（Sublime Text 2是收费软件，但可以无限期试用），也是HTML和散文先进的文本编辑器。Sublime Text是由程序员Jon Skinner于2008年1月份所开发出来，它最初被设计为一个具有丰富扩展功能的Vim。

Sublime Text具有漂亮的用户界面和强大的功能，并且是一个跨平台的编辑器，同时支持Windows、Linux、[Mac OS X](https://baike.baidu.com/item/Mac OS X)等操作系统。

登录官网下载 https://www.sublimetext.com/

2、插件安装

Emmet包管理

Sublime 可以通过扩展包来丰富编码功能，扩展插件网站：https://packagecontrol.io/

操作步骤

• 以下内容基于已经你已经在你的SublimeText中安装了package control
• 过快捷键组合ctrl+shift+P唤出命令面板
• 在面板中输入“install package”后回车
• 接着输入插件名称如：“emmet” 回车即可（观察状态栏进度，晃动的等号）

软件风格

风格包网站：https://packagecontrol.io/
风格：Spacegray

https://packagecontrol.io/packages/Theme%20-%20Spacegray

操作步骤

• 以下内容基于已经你已经在你的SublimeText中安装了package control
• 过快捷键组合ctrl+shift+P唤出命令面板
• 在面板中输入“install package”后回车
• 接着输入插件名称如：“Spacegray” 回车即可（观察状态栏进度，晃动的等号）

资源图标

包地址：https://github.com/ihodev/a-file-icon

操作步骤：

• 以下内容基于已经你已经在你的SublimeText中安装了package control
• 过快捷键组合ctrl+shift+P唤出命令面板
• 在面板中输入“install package”后回车
• 接着输入插件名称如：“A File Icon” 回车即可（观察状态栏进度，晃动的等号）

常用插件

• emmet：快速编写html/css：https://docs.emmet.io/
• docblockr：代码注释提示插件：[https://packagecontrol.io/packages/DocBlockr] (https://packagecontrol.io/packages/DocBlockr)
• sideBarEnhancements ：扩展左侧面板：https://packagecontrol.io/packages/SideBarEnhancements
• SideBarTools：扩展左侧面板：https://packagecontrol.io/packages/SideBarTools
• AdvancedNewFile：快速创建文件 ，使用ctrl+alt+n就可以快速创建文件
• Local History：本地历史记录：https://packagecontrol.io/packages/Local%20History
• Laravel 5 Artisan：laravel命令行插件:https://packagecontrol.io/packages/Laravel%205%20Artisan 按 ctrol+shift+p 搜索并执行命令
• Laravel 5 Snippets：laravel代码片段：https://packagecontrol.io/packages/Laravel%205%20Snippets
• Laravel Blade Highlighter：laravel blade模板高亮：https://packagecontrol.io/packages/Laravel%20Blade%20Highlighter
• Blade Snippets：blade 代码片段：https://packagecontrol.io/packages/Blade%20Snippets
• Laravel Blade AutoComplete：自动识别blade父级模板内容：https://packagecontrol.io/packages/Laravel%20Blade%20AutoComplete
• Bootstrap 3 Snippets：bootstrap 代码片段：https://github.com/JasonMortonNZ/bs3-sublime-plugin
• Bootstrap 3 Autocomplete：bootstrap样式提示：https://packagecontrol.io/packages/Bootstrap%203%20Autocomplete
• Bootstrap 4 Snippets：bootstrap代码提示：https://packagecontrol.io/packages/Bootstrap%204%20Snippets
• Bootstrap 4 Autocomplete：bootstrap4 自动提示：https://packagecontrol.io/packages/Bootstrap%204%20Autocomplete
• ApacheConf 对于htaccess和.conf文件：https://packagecontrol.io/packages/ApacheConf
• nginx 改进了对Nginx配置文件的语法支持：https://packagecontrol.io/packages/nginx
• Nginx Log Highlighter 日志高亮显示：[https://packagecontrol.io/packages/Nginx Log Highlighter](https://packagecontrol.io/packages/Nginx Log Highlighter)
• ChineseLocalizations 中文本地化：https://packagecontrol.io/packages/ChineseLocalizations
• SCSS：scss代码提示：https://packagecontrol.io/packages/SCSS
• Sass：scss语法高亮：https://packagecontrol.io/packages/Sass

3、格式化

首先通过以下路径打开用户按键绑定文件：

Preferences → Key Bindings – User

然后在其中添加以下代码（如果你有需要的话，其中的快捷键组合是可以自己定义的）：

[
	//格式化代码,single_line参数删除时，格式化只影响当前光标所在行
	{"keys": ["ctrl+alt+l"], "command": "reindent" , "args": {"single_line": false}}
]

4、内容检索

快速查找

默认情况下，Sublime Text支持函数快速查找，按Ctrl+Shift+R打开查找面板，就可以快速定位函数所在的文件，如果安装了emmet插件将会失效，我们需要做以下操作进行修复。

编辑 emmet插件配置项：

{"disabled_keymap_actions": "reflect_css_value"}

5、快捷键

使用快捷键可以显著提高开发效率，所以还是有必要掌握的。

1. 搜索文件：ctrl+p 输入文件名
2. 搜索函数/方法：ctrl+p 输入“文件名@方法名” 如 User@show
3. 跳转到指定行：ctrl+p 输入文件名:行号,只输入: 时在当前文件跳转
4. 查找当前文件方法：ctrl+r
5. 返回/前进编辑位置：Alt + -、Alt + Shift + -
6. 切换标签页：Ctrl + PgUp、Ctrl + PgDn
7. 选中单词：Ctrl + D 连续按会选中页面中所有单词，以实现批量编辑
8. 以单词为单位快速移动光标：Ctrl + ←、Ctrl + →
9. 选中当前行：Ctrl + L
10. 跳转到第几行：Ctrl+G
11. 跳转到对应括号：Ctrl+M
12. 开关侧栏：Ctrl+K+B
13. 选中当前括号内容，重复可选着括号本身：Ctrl+Shift+M
14. 注释当前html标签块：Ctrl+Shift+/
15. 专注编写模式：Shift+F11
16. 分屏显示：Alt+Shift+数字
17. Ctrl+Enter 在下一行插入新行。举个栗子：即使光标不在行尾，也能快速向下插入一行。
18. Ctrl+Shift+Enter 在上一行插入新行。举个栗子：即使光标不在行首，也能快速向上插入一行。
19. Ctrl+Shift+[ 选中代码，按下快捷键，折叠代码。
20. Ctrl+Shift+] 选中代码，按下快捷键，展开代码