Sublime 詳細配置筆記

我的 Sublime

爲什麼要用 Sublime Text

有人也許會有疑問，爲什麼不用 Dreamweaver、WebStrom、Visual Studio 這些大型 IDE？功能齊全又好用，爲什麼要用 Sublime Text 呢？

首先，IDE 雖好，但是由於 IDE 們內置了大量的功能插件，導致軟件啓動速度特別慢，而 Sublime Text 是一款編輯器，類似於記事本，沒有多餘的加載項，因此啓動速度很快。其次，IDE 的一大優點就是內置了許多強大的功能，但是平時學習工作中這些功能不一定用得到，因此造成了時間和資源的浪費，不適合平時較爲小型、零散的開發，而 Sublime Text 有自己的插件管理工具（Package Control），可以通過各種各樣的插件來擴展編輯器的功能，各種插件數量繁多，功能齊全，完全可以根據自己的需求自定義編輯器的功能，最大程度地提高效率。除此之外，Sublime Text 的擴展能力非常強大，包括插件、編譯文件、快捷鍵、代碼片段、主題配色等都可以完全自定義，只需要會用一點 Python 和正則表達式，通過一系列改裝，Sublime Text 完全可以變成自己獨一無二的個性化 IDE。與此同時，Sublime Text 是一款跨平臺的編輯器，在 Window、IOS 和 Linux 下都可以使用。

總的來說，Sublime Text 是圖形界面環境（GUI）下的最佳編輯器選擇 （Vim 是命令行環境（CLI）下的最佳選擇，喜歡 Emacs 的童鞋請無視這句話）

當然，類似的優秀的編輯器有很多，比如 Atom、Notepad++、VScode 等，我都試用過，不過體驗下來，發現還是 Sublime Text 在各個方面的表現都更加出色。

配置 Sublime Text

下載安裝 Sublime Text

Sublime Text 官網 下載最新安裝包，安裝好之後先別打開程序，先在程序所在文件中新建一個 “Data” 文件夾，然後再打開程序。這樣做的目的是爲了讓 Sublime Text 的配置直接保存在安裝文件夾中，方便備份和使用，如果不這麼做的話，在 Windows 平臺下默認會把配置文件保存到 “C:\Users\XXX\AppData” 裏面，不方便操作。

Sublime Text 是一款收費軟件，但是它是永久試用的。換句話說，如果你有閒錢的話，可以買一個 License 支持一下作者，售價是 $80。如果你沒有錢或者不想花錢的話，你也可以直接用，沒有任何問題，只是每隔一段時間會提示你正在使用未註冊版本。如果覺得彈窗不是大問題的話，大可放心使用，不過如果是強迫症患者受不了彈窗，也沒有問題，可以百度對應版本號的註冊碼，比如我現在使用的是 3176 版本，那麼就可以直接使用這個註冊碼：

----- BEGIN LICENSE -----
sgbteam
Single User License
EA7E-1153259
8891CBB9 F1513E4F 1A3405C1 A865D53F
115F202E 7B91AB2D 0D2A40ED 352B269B
76E84F0B CD69BFC7 59F2DFEF E267328F
215652A3 E88F9D8F 4C38E3BA 5B2DAAE4
969624E7 DC9CD4D5 717FB40C 1B9738CF
20B3C4F1 E917B5B3 87C38D9C ACCE7DD8
5F7EF854 86B9743C FADC04AA FB0DA5C0
F913BE58 42FEA319 F954EFDD AE881E0B
------ END LICENSE ------

當然，如果經濟上比較充裕的話，還是推薦購買一份支持作者的。

安裝 Package Control

初始的 Sublime Text 其實就是一個比記事本好看點的編輯器，爲了能夠更自由地改造，還需要安裝一個插件管理工具：Package Control。

在 Package Control 官網 上可以看到具體的安裝方法：

1. 在 Sublime Text 中通過快捷鍵 Ctrl+` 打開控制檯
2. 輸入代碼

import urllib.request,os,hashlib; h = '6f4c264a24d933ce70df5dedcf1dcaee' + 'ebe013ee18cced0ef93d5f746d80ef60'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)

即可完成安裝。隨後通過快捷鍵 ctrl + shift + p 打開命令面板，然後輸入 “Package Control” 即可看到 Pacakage Control 的各種指令，也可以直接使用指令的首字母的簡寫調用：

命令	功能
pcip	安裝插件
pcrp	刪除插件
pclp	列出已安裝插件

安裝常用插件

核心插件

名稱	功能
Package Control	插件管理插件
PackageResourceViewer	插件資源管理
SideBarEnhancements	擴展側邊欄功能
AdvancedNewFile	快速新建文件
IMESupport	輸入法跟隨光標
FindKeyConflicts	檢測快捷鍵衝突
Sublimerge 3	文件對比
Git	整合 Git 命令
Gitgutter	顯示當前倉庫狀態
A File Icon	文件圖標顯示

功能插件

前端工具

名稱	功能
Emmet	前端工具
PyV8	Emmet 所需插件，安裝 Emmet 時自動安裝
Gulp	整合 Gulp 命令
Better Completion	代碼補全
CSS3	更完整地支持CSS3 和 PostCSS-cssnext
SASS	SASS 語法高亮和自動完成
Color Convert	顏色代碼轉換
ColorPicker	顏色選擇器
Autoprefixer	添加 CSS 瀏覽器前綴
HTML-CSS-JS Prettify	HTML，CSS，JavaScript 和 JSON 代碼格式化程序，需要 nodejs 支持
SublimeLinter	代碼錯誤檢測工具，需要使用 nodejs 的 npm 在本地安裝相應的軟件
SublimeLinter-jshint	JavaScript 錯誤檢查工具，需要安裝 jshint
SublimeLinter-csslint	CSS 錯誤檢查工具，需要安裝 csslint

綜合工具

名稱	功能
Alignment	代碼對齊
BracketHighlighter	匹配各種括號並高亮顯示
File Header	文件標頭模板生成
AutoFileName	在需要輸入路徑的地方顯示路徑下的文件內容
DocBlockr	輔助生成代碼註釋
PlainTasks	TO-DO List 插件
MarkdownEditing	Markdown 編輯器
MarkdownPreview	Markdown 預覽以及導出
LaTeXTools	LaTeX 編輯器
LaTeX-cwl	LaTeX 自動完成

注意

• 使用 LaTeXTools 需要自己安裝 MikTex 以及 SumatraPDF，並且在配置文件裏面修改路徑，其中 SumatraPDF 需要把安裝路徑加入 PATH。同時爲了實現內容回溯，需要用到命令：

sumatrapdf.exe -inverse-search "\"C:\Program Files\Sublime Text 3\sublime_text.exe\" \"%f:%l\""

安裝主題配色

個人覺得比較好看的主題有兩個：

• Theme - Gravity
• DA UI

都可以通過 Package Control 直接搜索安裝，上圖中我就是混合使用 DA UI 的主題和 Theme - Gravity 的配色。更多的主題和配色可以在 Package Control 的官網上找到。

自定義設置

Sublime Text 的設置在 “Preferences -> Settings” 中，打開之後左邊是每個設置項的具體描述，右邊就可以編輯自己的設置了。下面給出的是我使用的設置：

{
	// Theme
	"theme": "DA.sublime-theme",                                         // DA UI 主題
	"color_scheme": "Packages/Theme - Gravity/Monokai Gravity.tmTheme",  // Gravity 的配色

	// Font
	"font_size": 16,                 // 設置字體大小
	"font_face": "Source Code Pro",  // 設置字體，如果沒有安裝 Source Code Pro 的話推薦使用 Consolas
	"font_options": ["gdi"],         // 字體選項，使用 "gdi" 的方式渲染字體，如果沒有這個選項，在最新版的 Sublime 中的中文顯示會出問題

	// Edit
	"tab_size": 2,                              // tab 一下縮進2個單位
	"translate_tabs_to_spaces": true,           // 將 tab 轉成空格
	"trim_trailing_white_space_on_save": true,  // 保存文件時將行尾的空白都去掉
	"ensure_newline_at_eof_on_save": true,      // 保存文件時確保文件最後一行是空行

	// View
	"show_encoding": true,   // 界面右下角顯示當前的文件編碼
	"highlight_line": true,  // 將光標所在行高亮

	// Auto Complete
	"auto_complete_commit_on_tab": true,  // 使用 tab 自動補全
	"auto_complete_cycle": true,          // 在自動補全的彈窗中可以循環選擇項目
	"auto_complete_triggers":             // 設置具體的自動完成觸發規則
	[
		{
			"characters": "<",
			"selector": "text.html"
		},
		{
			"characters": "\\",
			"selector": "text.tex.latex"
		}
	],

	// Match（此處是爲了配合 BracketHighlighter 插件而做的更改）
	"match_brackets": false,
	"match_brackets_angle": false,
	"match_brackets_braces": false,
	"match_brackets_content": false,
	"match_brackets_square": false,
	"match_tags": false,

	// Package Ignorance
	"ignored_packages": ["Vintage"]  // 忽略插件
}

使用 Sublime Text

使用技巧

編譯系統

Sublime Text 自帶多語言的編譯選項，位於 “Tools -> Build System” 中，不過 Sublime Text 本身不帶有任何編譯器，需要提前安裝好所需編譯器並添加到系統的 PATH 中，現在以 C++ 爲例，寫一個編譯文件，提供額外的編譯選項。編譯文件以 “.sublime-build” 結尾，保存在 “Data/Packages/User” 下（通過 “Preferences -> Browser Packages” 訪問），可以自己新建文件也可以通過 “Tools -> Build System -> New Build System” 新建編譯文件。

{
	"encoding": "utf-8",
	"shell_cmd": "g++ -Wall -std=c++11 \"$file_name\" -o \"$file_base_name\"",
	"file_regex": "^(..[^:]*):([0-9]+):?([0-9]+)?:? (.*)$",
	"working_dir": "$file_path",
	"selector": "source.c++, source.c",
	"variants":
	[
		{	
			"name": "Display in Sublime",
	        "shell_cmd": "g++ -Wall -std=c++11 \"$file_name\" -o \"$file_base_name\" && cmd /c \"${file_path}/${file_base_name}\""
		},
		{	
			"name": "Display in CMD",
	        "shell_cmd": "g++ -Wall -std=c++11 \"$file\" -o \"$file_base_name\" && start cmd /c \"\"${file_path}/${file_base_name}\" & pause\""
		},
		{	
			"name": "Buld with Makefile",
	        "shell_cmd": "make && start cmd /c \"\"${file_path}/${file_base_name}\" & pause\""
		},
		{	
			"name": "Debug in GDB",
	        "shell_cmd": "g++ -g -std=c++11 \"$file\" -o \"$file_base_name\" && start cmd /c gdb ${file_path}/${file_base_name} & pause"
		}
	]
}

各個參數的含義和使用方法參照這篇博客：http://www.yalewoo.com/sublime_text_3_gcc.html

代碼片段

Sublime Text 自帶了許多語言的常見代碼片段，然而在某些情況下，自帶的代碼片段不能滿足自己的需求，比如結構不符合，參數不符合等等，這時可以利用自定義的代碼片段來解決問題。可以自己新建代碼片段保存爲 “.sublime-snippet” 文件，也可以通過 “Tools -> Developer -> New Snippet” 新建代碼片段，自定義代碼片段也保存在 “Data/Packages/User” 文件夾下。

<snippet>
	<description>Custom if</description>
	<content><![CDATA[if (${1:/* condition */}) {
  ${2:/* codes */}
}]]></content>
	<tabTrigger>if</tabTrigger>
	<scope>source.c, source.objc, source.c++, source.objc++</scope>
</snippet>

這其中：

• ：觸發自動完成時，待選項右邊顯示的描述。
• ：代碼片段內容，從 “<![CDATA[" 開始，到 "]]>” 結束。類似 “${1:xxx}” 的結構的作用是在顯示片段後，光標所在的位置，通過 tab 鍵切換，順序就是裏面的數字大小，唯一不同的是 “$0”，它代表代碼片段結束的位置。
• ：觸發代碼片段的關鍵詞。
• ：代碼片段的適用範圍

快捷鍵

Sublime Text 自帶了各種各樣的快捷鍵，有關快捷鍵的具體使用說明在下一部分，這裏主要的目的是解決快捷鍵的一個常見問題。這個問題就是發生按鍵衝突，發生衝突的原因有很多種：要麼是由於不同的插件有自己的快捷鍵，但是鍵盤上的按鍵就那麼多，因此很多插件會由於快捷鍵衝突而無法使用；要麼某些系統或軟件的快捷鍵和 Sublime Text 的快捷鍵起衝突。無論是哪種，都有可能需要自己修改默認的快捷鍵，除此之外，有時候某些快捷鍵不符合自己的習慣，這時也需要修改默認的快捷鍵。快捷鍵在 “Preferences -> Key Bindings” 進行設置，接下來以處理按鍵衝突爲例，展示如何修改快捷鍵：

首先利用之前安裝的 “FindKeyConflicts” 插件檢查具體發生衝突的有哪些按鍵：

ctrl + shift + p 打開命令欄，然後輸入 “fkc”，在下方選擇 “FindKeyConflicts：All Conflicts”，然後稍等片刻就會顯示。現在隨便取一個按鍵爲例子：

[ctrl+s]
   save             Default
   sublimerge_save  Sublimerge 3  [{"key": "setting.is_sublimerge_view", "operator": "equal", "operand": true, "match_all": true}]

在這個例子中，ctrl + s 這個按鍵有兩個行爲，一個是默認的保存功能，一個是插件 “Sublimerge 3” 提供的 “sublimerge_save” 功能。儘管實際上，由於插件的按鍵設置中的 “Context（解決按鍵衝突的額外方法）” 部分的設置，並不會發生衝突，但這裏假設它發生衝突，需要把它改爲其他按鍵。

首先在對應插件的設置中，這裏以 Sublimerge 爲例的話就是：“Preferences -> Package Settings -> Sublimerge” 找到 “Key Bindings - User”，點擊打開後即可輸入自己的快捷鍵設置：

{ "keys": ["ctrl+s","ctrl+c"], "command": "sublimerge_save", "context": [
    {"key": "setting.is_sublimerge_view", "operator": "equal", "operand": true, "match_all": true}
]}

這其中：

• “keys”：具體的按鍵，這裏的 “[“ctrl+s”,“ctrl+c”]” 代表多個按鍵，即按住 “ctrl” 鍵然後順序按下 “s” 和 “c”。
• “command”：執行的命令，這裏的命令一般是插件提供的。
• “context”：上下文，可以在這裏指定快捷鍵生效的具體條件。

常用快捷鍵

通用（General）

• ↑↓←→：上下左右移動光標
• Alt：調出菜單
• Ctrl + Shift + P：調出命令板（Command Palette）
• Ctrl + ` ：調出控制檯

編輯（Editing）

• Ctrl + Enter：在當前行下面新增一行然後跳至該行
• Ctrl + Shift + Enter：在當前行上面增加一行並跳至該行
• Ctrl + ←/→：進行逐詞移動
• Ctrl + Shift + ←/→進行逐詞選擇
• Ctrl + ↑/↓移動當前顯示區域
• Ctrl + Shift + ↑/↓移動當前行

選擇（Selecting）

• Ctrl + D：選擇當前光標所在的詞並高亮該詞所有出現的位置，再次 Ctrl + D 選擇該詞出現的下一個位置，在多重選詞的過程中，使用 Ctrl + K 進行跳過，使用 Ctrl + U 進行回退，使用 Esc 退出多重編輯
• Ctrl + Shift + L：將當前選中區域打散
• Ctrl + J：把當前選中區域合併爲一行
• Ctrl + M：在起始括號和結尾括號間切換
• Ctrl + Shift + M：快速選擇括號間的內容
• Ctrl + Shift + J：快速選擇同縮進的內容
• Ctrl + Shift + Space：快速選擇當前作用域（Scope）的內容

查找&替換（Finding&Replacing）

• F3：跳至當前關鍵字下一個位置
• Shift + F3：跳到當前關鍵字上一個位置
• Alt + F3：選中當前關鍵字出現的所有位置
• Ctrl + F/H：進行標準查找/替換，之後：
  • Alt + C：切換大小寫敏感（Case-sensitive）模式
  • Alt + W：切換整字匹配（Whole matching）模式
  • Alt + R：切換正則匹配（Regex matching）模式
  • Ctrl + Shift + H：替換當前關鍵字
  • Ctrl + Alt + Enter：替換所有關鍵字匹配
• Ctrl + Shift + F：多文件搜索&替換

跳轉（Jumping）

• Ctrl + P：跳轉到指定文件，輸入文件名後可以：
  • @ 符號跳轉：輸入 @symbol 跳轉到 symbol 符號所在的位置
  • # 關鍵字跳轉：輸入 #keyword 跳轉到 keyword 所在的位置
  • : 行號跳轉：輸入 :12 跳轉到文件的第12行。
• Ctrl + R：跳轉到指定符號
• Ctrl + G：跳轉到指定行號

窗口（Window）

• Ctrl + Shift + N：創建一個新窗口
• Ctrl + N：在當前窗口創建一個新標籤
• Ctrl + W：關閉當前標籤，當窗口內沒有標籤時會關閉該窗口
• Ctrl + Shift + T：恢復剛剛關閉的標籤

屏幕（Screen）

• F11：切換普通全屏
• Shift + F11：切換無干擾全屏
• Alt + Shift + 2：進行左右分屏
• Alt + Shift + 8：進行上下分屏
• Alt + Shift + 5：進行上下左右分屏
• 分屏之後，使用 Ctrl + 數字鍵 跳轉到指定屏，使用 Ctrl + Shift + 數字鍵 將當前屏移動到指定屏

參考鏈接

官方文檔：http://www.sublimetext.com/docs/3/
官方論壇：http://www.sublimetext.com/forum/
非官方文檔（推薦）：http://sublime-text-unofficial-documentation.readthedocs.org/
Sublime Text 全程指南：http://lucida.me/blog/sublime-text-complete-guide/