SublimeText3經常使用插件及快捷鍵總結

SublimeText可謂是前端工程師的代碼編輯神器，自從用上它之後一直愛不釋手，特別是它強大的插件功能，簡直要逆天了。網上也有不少關於SublimeText3的各類插件介紹，其插件功能之多，讓人眼花繚亂。今天我主要是來整理一下本身經常使用的前端插件，並打包上傳至個人github,歡迎你們下載交流，如有更好用的插件，還但願推薦。
好了廢話很少說如今就開始驚奇的sublime之旅

NO.1 下載安裝

點擊進入sublime官網,根據本身的電腦系統下載相應的版本
將下載的壓縮包解壓後直接放進你要安裝的文件夾，雙擊sublime_text.exe便可運行

獲取license

雖然沒有許可證也可使用，但軟件開發及維護不易，建議有條件的同窗仍是購買license，得到永久使用權

NO.2 插件安裝

這是今天的重點，在安裝插件以前咱們須要安裝package control組件

1. 在線安裝
   按ctrl+`調出console面板,粘貼如下代碼（或者SUBLIME TEXT 3面板中的代碼）到命令行並回車
   import urllib.request,os; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); open(os.path.join(ipp, pf), 'wb').write(urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ','%20')).read())
   重啓Sublime Text 3。若是在Perferences->package settings中看到package control這一項，則安裝成功。
2. 手動安裝
   若是你的電腦沒有外網權限(小編就是這樣)，那隻能手動安裝了
   點擊Preferences 選擇Browse Packages… ，打開其上一級文件夾Data並進入Installed Packages文件夾
   將下載的Package Control.sublime-package文件複製進去，再重啓Sublime Text

安裝方法介紹

1. 在線安裝
   按下Ctrl+Shift+P調出命令面板，輸入install選擇Install Package 選項並回車，
   再輸入你要安裝的插件名稱(例如sublime tmpl)，而後在列表中選中要安裝的插件。
   安裝成功後通常在Perferences->package settings中可看到
   有些插件有可能在列表中搜索不到，你能夠選擇手動安裝
   
2. 手動安裝
   進入sublimetext安裝包管理器官網在搜索框裏輸入你所須要的插件名稱
   進入插件的github頁面（點擊Details下面的github.com）,點擊右側的clone or download -> Download ZIP,將下載的壓縮包解壓後放在Preferences->Browse Packages（即packages文件夾）裏面，並重命名（去掉文件名中的-master）
   重啓Sublimetext3便可安裝成功

There are no packages available for installation

現實中沒有什麼事情老是一路順風的，特別是計算機程序，時不時就給你來點意外狀況。
例如在在線安裝步驟中選擇Install Package後Sublime彈出窗口提示
There are no packages available for installation
出現的緣由：聽說是IPv6的緣由，若是咱們的Intent服務提供者（ISP）不支持IPv6就會引起上述錯誤，
解決方法一：
打開C:\Windows\system32\drivers\etc\hosts文件，增長以下對應關係：50.116.34.243 sublime.wbond.net
終極解決方法：用手動安裝插件

在線安裝的插件介紹

1. Alignment

使用說明：Alignment是一個代碼格式化插件，它可使多行代碼中的等號對齊，也能夠調整多行代碼爲一個縮進級別。
快捷鍵：ctrl+shift+alt+a

2. AutoFileName

使用說明：文件名自動補全

3. BracketHighlighter

使用說明：BracketHighlighter插件是用來匹配相對的符號，而後高亮顯示，好比{ }、[ ]、" "等符號的對應高亮顯

4. ConvertToUTF8

使用說明：自動轉爲UTF-8編碼類型

5. DeleteBlankLines

使用說明：選中須要批量刪除空行的部分，Ctrl + Alt + Backspace，選中部分的全部空行就都被刪除了
快捷鍵：ctrl+alt+backspace

6. DocBlockr

使用說明：生成js ,php 等語言函數註釋,只須要在函數上面輸入/** ,而後按tab 就會自動生成註釋

7. Emmet

使用說明：它讓編寫 HTML 代碼變得簡單。
Emmet用法參見Emmet插件使用方法總結

8.HTML-CSS-JS Prettify

使用說明：快速格式化html css js
快捷鍵：ctrl+shift+h

9. jQuery

使用說明：會出現jquery提示

10. LESS

使用說明：支持less語法高亮

11. Less2Css

使用說明：ctrl+s保存less文件時，會將目錄下全部less文件自動編譯爲同名的css文件，詳細使用方法參見sublime中如何用less實現css預編譯
快捷鍵：ctrl+s

12. SideBarEnhancements

使用說明：SideBarEnhancements 是一款很實用的右鍵菜單加強插件，有以 diff 形式顯示未保存的修改、在文件管理器中顯示該文件、複製文件路徑、在側邊欄中定位該文件等功能，也有基礎的諸如新建文件/目錄，編輯，打開/運行，顯示，在選擇中/上級目錄/項目中查找，剪切，複製，粘貼，重命名，刪除，刷新等常見功能。

13. SublimeCodeInte

使用說明：Sublime​Code​Intel 是一個代碼提示、補全插件，支持 JavaScript、Mason、XBL、XUL、RHTML、SCSS、Python、HTML、Ruby、Python三、XML、Sass、XSLT、Django、HTML五、Perl、CSS、Twig、Less、Smarty、Node.js、Tcl、TemplateToolkit 和 PHP 等語言，是 Sublime Text 自帶代碼提示功能的很好擴展。

14. sublime tmpl

使用說明：按指定快捷鍵生成模板。
快捷鍵：
ctrl+alt+h 新建html模板文件
ctrl+alt+j 新建javascript模板文件
ctrl+alt+c 新建css模板文件
ctrl+alt+p 新建php模板文件
ctrl+alt+r 新建ruby模板文件
ctrl+alt+shift+p 新建python模板文件

15. SublimeLinter

使用說明：它能夠幫你找出錯誤或編寫不規範的代碼 須要安裝nodejs,jshint

16. SublimeLinter-jshint

使用說明：對錯誤的javascript代碼在狀態欄進行提示，

17. Terminal

使用說明：調出終端直接進入項目所在根目錄，這個插件與gulp配合很好用
快捷鍵：ctrl+shift+t

18. View In Browser

使用說明：sublime以本地服務器方式打開網頁
爲了使用插件，你須要創建一個sublime-project文件，點擊Project->Edit Project
粘貼如下代碼(這是個人相關配置),並保存到user目錄下

{
    "folders":
    [
        {
            "path": "D:\\wamp\\www"    
        }
    ],
    "settings":
    {
        "sublime-view-in-browser":
        {
            "baseUrl": "http://localhost"  
            "basePath": "D:\\wamp\\www",   //本地虛擬主機根目錄
        }
    }
}

快捷鍵：ctrl+alt+v

19. MarkdownEditing

使用說明：它支持Markdown語法高亮顯示。

20. OmniMarkupPreviewer

使用說明：用來在瀏覽器中預覽markdown 編輯的效果
快捷鍵：ctrl+alt+o

手動安裝的插件介紹

注意：手動安裝的插件不會自動添加到Package Control.sublime-package文件

1. Compact​Expand​Css

下載地址:https://github.com/TooBug/CompactExpandCss
使用說明：css橫豎向排列切換
快捷鍵：
ctrl+alt[橫向排列
ctrl+alt]豎向排列

2. Codelf

下載地址：Codelf for Sublime Text
使用說明：變量命名神器Codelf經過搜索在線開源平臺的項目源碼幫開發者給變量命名 ，有了它不再用爲了命名而絞盡腦汁了
快捷鍵：鼠標右鍵，選擇Codelf

待定的插件

sublime git

YUI compress

livestyle

GBKEncoding support 中文支持

php_beautifier

php code sniffer

NO.3 Sublime Text 3 快捷鍵大全

選擇類

Ctrl+D 選中光標所佔的文本，繼續操做則會選中下一個相同的文本。

Alt+F3 選中文本按下快捷鍵，便可一次性選擇所有的相同文本進行同時編輯。

Ctrl+L 選中整行，繼續操做則繼續選擇下一行，效果和 Shift+↓ 效果同樣。

Ctrl+Shift+L 先選中多行，再按下快捷鍵，會在每行行尾插入光標，便可同時編輯這些行。

Ctrl+Shift+M 選擇括號內的內容（繼續選擇父括號）。

Ctrl+M 光標移動至括號內結束或開始的位置。

Ctrl+Enter 在下一行插入新行。舉個栗子：即便光標不在行尾，也能快速向下插入一行。

Ctrl+Shift+Enter 在上一行插入新行。

Ctrl+Shift+[ 選中代碼，按下快捷鍵，摺疊代碼。

Ctrl+Shift+] 選中代碼，按下快捷鍵，展開代碼。

Ctrl+K+0 展開全部摺疊代碼。

Ctrl+← 向左單位性地移動光標，快速移動光標。

Ctrl+→ 向右單位性地移動光標，快速移動光標。

shift+↑ 向上選中多行。

shift+↓ 向下選中多行。

Shift+← 向左選中文本。

Shift+→ 向右選中文本。

Ctrl+Shift+← 向左單位性地選中文本。

Ctrl+Shift+→ 向右單位性地選中文本。

Ctrl+Shift+↑ 將光標所在行和上一行代碼互換（將光標所在行插入到上一行以前）。

Ctrl+Shift+↓ 將光標所在行和下一行代碼互換（將光標所在行插入到下一行以後）。

Ctrl+Alt+↑ 向上添加多行光標，可同時編輯多行。

Ctrl+Alt+↓ 向下添加多行光標，可同時編輯多行。

編輯類

Ctrl+J 合併選中的多行代碼爲一行。舉個栗子：將多行格式的CSS屬性合併爲一行。

Ctrl+Shift+D 複製光標所在整行，插入到下一行。

Tab 向右縮進。

Shift+Tab 向左縮進。

Ctrl+K+K 從光標處開始刪除代碼至行尾。

Ctrl+Shift+K 刪除整行。

Ctrl+/ 註釋單行。

Ctrl+Shift+/ 註釋多行。

Ctrl+K+U 轉換大寫。

Ctrl+K+L 轉換小寫。

Ctrl+Z 撤銷。

Ctrl+Y 恢復撤銷。

Ctrl+U 軟撤銷，感受和 Gtrl+Z 同樣。

Ctrl+F2 設置書籤

Ctrl+T 左右字母互換。

F6 單詞檢測拼寫

搜索類

Ctrl+F 打開底部搜索框，查找關鍵字。

Ctrl+shift+F 在文件夾內查找

Ctrl+P 打開搜索框。舉個栗子：一、輸入當前項目中的文件名，快速搜索文件，二、輸入@和關鍵字，查找文件中函數名，三、輸入：和數字，跳轉到文件中該行代碼，四、輸入#和關鍵字，查找變量名。

Ctrl+G 打開搜索框，自動帶：，輸入數字跳轉到該行代碼。

Ctrl+R 打開搜索框，自動帶@，輸入關鍵字，查找文件中的函數名。舉個栗子：在函數較多的頁面快速查找某個函數。

Ctrl+： 打開搜索框，自動帶#，輸入關鍵字，查找文件中的變量名、屬性名等。

Ctrl+Shift+P 打開命令框。

Esc 退出光標多行選擇，退出搜索框，命令框等。

顯示類

Ctrl+Tab 按文件瀏覽過的順序，切換當前窗口的標籤頁。

Ctrl+PageDown 向左切換當前窗口的標籤頁。

Ctrl+PageUp 向右切換當前窗口的標籤頁。

Alt+Shift+1 窗口分屏，恢復默認1屏（非小鍵盤的數字）

Alt+Shift+2 左右分屏-2列

Alt+Shift+3 左右分屏-3列

Alt+Shift+4 左右分屏-4列

Alt+Shift+5 等分4屏

Alt+Shift+8 垂直分屏-2屏

Alt+Shift+9 垂直分屏-3屏

Ctrl+K+B 開啓/關閉側邊欄。

F11：全屏模式

Shift+F11 免打擾模式