Sublime Text从安装到配置

安装

Sublime Text 官网

  • 下载安装包,然后安装(默认的扩展包文件夹装在 C 盘,不习惯,选择另一种)
  • 下载移动版,解压后使用(推荐

自此之前,先认识两个快捷键,以后会经常用到:

  • ctrl+shift+p打开命令面板(menu: Tools > Command Palette
  • ctrl+`打开控制台(menu: View > Show Console

基本设置

通过菜单Preferences > settings打开设置页进行设置,不要动默认的设置文件,在用户设置文件中进行设置

最好将自定义的设置文件备份,以备不时之需

我的设置:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
{
"always_show_minimap_viewport": true,
"bold_folder_labels": true,
"color_scheme": "Packages/Monokai Extended/Monokai Extended.tmTheme",
"font_size": 12,
"ignored_packages":
[
"Vintage"
],
"indent_guide_options"://缩进显示稍有不同
[
"draw_normal",
"draw_active"
],
"line_padding_bottom": 2,
"line_padding_top": 2,
"overlay_scroll_bars": "enabled",//滚动条自动隐藏
"show_encoding": true,
"theme": "Soda Light 3.sublime-theme",
"wrap_width": 80,
"word_wrap": true
}

让 Sublime Text 支持浏览器中预览

菜单 Tools > Developer >New Plugin 新建一个插件,文件名自取,用 python 编写,然后绑定自定义快捷键。

具体实现在另一篇文章里:让 Sublime Text 支持浏览器中预览

扩展包管理器

Sublime Text 的强大之处在于可以融合丰富的扩展包,安装扩展包可以手动下载对应的包文件放入 ST,而更方便的方式是用 Package Control。除此之外,已安装的扩展包的功能也能通过 Package Control 来调用。

Package Control 本身也是一个扩展包,需要先进行安装。
安装方式:打开控制台,输入 python 安装代码,回车等待。

具体代码和方式不同版本可能会不同,最好去官网查看。

Package Control 网站收录了丰富的扩展包,可以寻找自己的想要的扩展功能和主题。
在安装任意扩展包前,可以先去此网站中寻找,查看包信息。

主题与配色

Sublime Text 的主题和配色方案,通过菜单 Preferences > Color SchemeTheme 来选择使用。

ST 一般会自带几个主题和配色,也能凑合用。

我比较习惯 Soda 主题和 Monokai 配色,虽然 Material 主题很酷炫,但有些废眼,弃了。虽然可以通过其他方式自定义配色方案,懒得折腾了。

安装 Soda 很简单,打开命令面板,利用 Package Control:Install Package 找到 Theme Soda 回车安装。
接着用同样的方式安装专门配套 Soda 主题的 Monokai 配色包:Monokai Extended。

安装完成后通过菜单选择来使用,或者在 settings 文件中设置相关字段。

常用扩展包

在 Package Control 网站上可以看到扩展包的下载量和受欢迎程度。

常用的包介绍可以看另一篇文章:

这里只列举我自己安装的几个包。(打开 Package Control 的 settings-user 可以看到已安装的所有包)

Emmet

Emmet 是一个前端开发的利器,其前身是 Zen Coding。它让编写 HTML/CSS 代码变得简单快速。
使用时输入简写形式,然后按 Tab 键。
Emmet 还重写配备了许多快捷键来操作 Html 代码,非常强大。

Emmet 是受到 snippets 的启发,说白了就是重用代码块,将常用的代码块保存成智能模板,需要时用快速高效的调用。

很多编辑器都有 snippets 功能,ST 也不例外。
menu:Tools > Snippets可以查看当前已有的 snippets;
menu:Tools > Developer > New Snippet可以新建 snippet,自己编写。

收藏的一篇文章中有具体实现:教你写Sublime中的Snippet

如果要自定义 Emmet 中的 snippets,需要新建 snippet.json 保存在扩展文件夹,具体请查看文档。

关于 Emmet 的更多用法,请看官方文档速查表可以帮你快速记忆简写形式。

SublimeLinter

SublimeLinter 是一个代码校验插件,它可以帮你找出语法错误或编写不规范的代码。
其本身并不包含具体的 Linters 组件,需要针对不同的语言安装对应的组件。

安装Sublime​Linter-php,安装完成后,打开:Preferences > Package Settings > SublimeLinter > Settings设置:

1
2
3
4
5
6
7
8
9
{
"paths": {
"linux": [],
"osx": [],
"windows": [
"D:\\wamp\\bin\\php\\php7.0.10"
]
}
}

SublimeLinter 默认以 background 模式运行,在用户输入的同时即时校验,如果想要 Sublime Text 运行得更流畅,可以改为 load-save 模式或 save-only 模式,在读取和保存时才校验。

另外,如果想校验 Javascript 和 CSS 语法,查看转载的文章:SublimeLinter 校验 JS 和 CSS

SublimeCodeintel

Sublime​Code​Intel 是一个代码提示、自动补全插件,支持大多数语言,是 Sublime Text 自带代码提示功能的很好扩展。

它还有一个功能就是跳转到变量、函数定义的地方,十分方便。

使用之前需要安装相应程序并配置路径到 ~/.codeintel/configproject_root/.codeintel/config 中,ReadMe 中有详细的说明,不再赘述。

设置内容如下:

1
2
3
4
5
6
7
8
9
10
{
"PHP": {
"php": 'D:\wamp\bin\php\php7.0.10\php.exe',
"phpExtraPaths": ['D:\wamp\bin\php\php7.0.10\ext'],
"phpConfigFile": 'D:\wamp\bin\php\php7.0.10\php.ini'
},
"JavaScript": {
"javascriptExtraPaths": []
}
}

windows 下无法用一般方式新建 .codeintel 文件夹,可以用 cmd 命令框来创建,或者直接用 Sublime Text 创建。

Markdown Preview

Markdown Preview 可以高亮 md 语法,并且可输出为 Html 文件。在 ST 下的 Markdown 插件有很多,MarkdownEditing也比较受欢迎。

Markdown Preview 的具体用法请看另一篇:Sublime Text 下的 Markdown 写作

BracketHighlighter

Bracket​Highlighter 是一个括号、引号、标签高亮插件,比如 []、()、{}、””、’’、和自定义的括号,比 Sublime Text 自带的高亮要明显得多。

0%
Title - Artist
0:00