首先宣告，我用的是 sublime 3
sublime 每次安裝時，左下角都有個  [ = ]  形狀的圖示，中間等號在滑動，若安裝成功則消失
以下外掛基本都是親測有效的，我自己就是這麼安裝的
sublime 3 小技巧：縮排在右下角 的tabSize 或 space

安裝外掛之前的準備工作：

1、開啟Sublime 3，然後按 ctrl+` 或者在View → Show Console（如若是用的中文版，那就是：檢視 ——> 顯示/隱藏控制檯）
2、在開啟的窗口裡黏貼這個網站上的程式碼（注意: Sublime 2和3所黏貼的程式碼不一樣，注意選擇）
    連結：

常用的外掛：

0、ChineseLocalization：漢化包語言包
    （1）、安裝package control：開啟sublime，使用快捷鍵：Ctrl+“~”調出console，然後複製如下程式碼並貼上上去；最後回車即可安裝好package control，安裝好後需要重啟sublime編輯器。

import urllib.request,os,hashlib; h = 'eb2297e1a458f27d836c04bb0cbaf282' + 'd0e7a3098092775ccb37ca9d6b2e4b7d'; 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)
 

    （2）、安裝漢化包：使用快捷鍵：Ctrl+shift+p（或者：選單 – Tools – Command Paletter），輸入package control install，然後回車並等待彈出另一個視窗，之後輸入Chinese，之後選擇ChineseLocalization(回車或者滑鼠單擊擊)。
    （3）、選擇help->language->簡體中文

1、emmet：通過一套簡單的語法讓你快速生成大量的HTML程式碼（比如輸入英文的 !，點選 tab 鍵自動完成 html 頁面樣式程式碼）
    連結：http://docs.emmet.io/abbreviations/syntax/
    安裝：Ctrl+Shift+P → Package Control: Install Package → Emmet

2、HTML-CSS-JS Prettify：程式碼格式化（Sublime Text 自帶程式碼格式化功能，見下文備註）
    （編輯HTML, CSS, JS時，經常會出現縮排不對，程式碼行不對其的情況。裝了這個外掛之後，只要按下Ctrl+Shift+h (Windows), Command+Shift+h (Mac), 你的文件就會被整理乾淨。）
    連結：https://packagecontrol.io/packages/HTML-CSS-JS%20Prettify
    安裝：https://www.cnblogs.com/yuanbo88/p/6065773.html（此連結中講解詳細並配有圖片，若此連結不可用，則見下文）
        步驟一：Ctrl+Shift+P → Package Control: Install Package → HTML-CSS-JS Prettify
        步驟二：檢視本地安裝的NodeJS配置環境路徑（在dos命令下，輸入where node並回車，得到路徑如：E:\nodejs\node.exe）。
        步驟三：在編輯器的任意一個html/js/css檔案中，右擊，出現如下圖所示，選擇Set Plugin Options，sublime 3 選擇 Plugin Options - Default 。
        步驟四：將上述步驟2中的NodeJS本地路徑儲存到步驟3中開啟的檔案中，儲存位置是‘node_path'中的’windows'，將其替換。
        步驟五：使用，無論是 html/css/js 其中哪種檔案需要格式化，右擊選擇 html/css/js prettify，再選擇 prettify code 即可。
    備註：Sublime Text 自帶程式碼格式化功能，不必安裝外掛，位置在[Preferences]->[Key Bindings]->[User]中,   中文版的位置在  [首選項]->[按鍵繫結-使用者]，彈出的頁面中。新增如下程式碼，為其設定快捷鍵：Ctrl+Shift+r。我親測之後發現效果並不好，

    {
	 	"keys": ["ctrl+shift+r"],
	 	"command": "reindent", 
	 	"args": {
	    	"single_line": false
	    }
	}

3、livestyle：同步 Chrome 除錯的 css 樣式到 css 檔案
    （這貨太神奇了。在除錯頁面的樣式時，經常會開啟Chrome自帶的開發者工具，然後編輯CSS，等滿意了再把CSS程式碼黏貼回Sublime裡。這貨允許你在Chrome裡修改CSS，然後相對應的在Sublime裡的CSS檔案就自動更新了！（你更新Sublime裡的CSS並儲存，開啟的網頁也會自動更新）
    連結：http://livestyle.emmet.io/
    安裝：需要安裝兩個外掛，一個是Sublime的外掛，一個是Chrome的外掛。
        Sublime外掛: Ctrl+Shift+P → Package Control: Install Package → LiveStyle
        Chrome外掛: https://chrome.google.com/webstore/detail/emmet-livestyle/diebikgmpmeppiilkaijjbdgciafajmg
    注意：先重啟你的Sublime，然後開啟一個CSS檔案。然後在Chrome裡開啟包含這個CSS的HTML頁面 → 開啟Chrome的開發者工具，工具欄的最後會多出一個 LiveStyle選項：    看下方File mapping裡被HTML頁面引用的CSS檔案會自動和Sublime裡開啟的同名CSS檔案關聯起來。如果名字都對的話你就可以在Elements裡開始編輯CSS了。編輯好後看下Sublime，該CSS檔案會被自動更新。

4、Bracket Highlighter：高亮各種括號的起始和結尾
    連結：https://github.com/facelessuser/BracketHighlighter
    安裝：Ctrl+Shift+P → Package Control: Install Package → BracketHighlighter

5、Sidebar Enhancement：讓Sublime的側邊欄多出許多必備功能，如在瀏覽器中開啟，改名，複製檔案連結等等
    連結：https://github.com/titoBouzout/SideBarEnhancements
    安裝：Ctrl+Shift+P → Package Control: Install Package → SideBarEnhancements

6、CSS3：支援CSS3裡的語法高亮。(Sublime3裡自帶的CSS高亮不夠用)。安裝後, 開啟一個CSS檔案，然後按照下面GIF操作，將CSS3高亮作為CSS檔案的預設高亮）（這裡我也沒有那個 GIF 圖，我也不確定我現在的高亮是哪一種）
    連結：https://github.com/y0ssar1an/CSS3
    安裝：Ctrl+Shift+P → Package Control: Install Package → CSS3

7、Sidebar Enhancement：讓Sublime的側邊欄多出許多必備功能，如在瀏覽器中開啟，改名，複製檔案連結等等
    連結：https://github.com/titoBouzout/SideBarEnhancements
    安裝：Ctrl+Shift+P → Package Control: Install Package → SideBarEnhancements

8、Color Picker：內建調色盤，選擇相應的顏色，獲取顏色碼並輸入在游標處
    安裝：Ctrl+Shift+P → Package Control: Install Package → ColorPicker
    使用：在頁面內 右擊，選擇 insert color with color picker，調色盤就打開了。
   （檢視已安裝外掛：
    1、中文版：首選項 ——> 瀏覽外掛目錄
    2、英文版：preference ——> Browse Packages）
    我在檢視我的電腦時並未發現裡面有 ColorPicker 外掛，但是我還是可以通過以上使用方法使用，原因暫且不明）

9、less：使用 less 編寫 css 程式碼（建議這段話看不明白的小夥伴可以看一遍以下視訊教程的第一章內容，很短 十分鐘左右）
    視訊教程：https://www.imooc.com/learn/102
    安裝：Ctrl+Shift+P → Package Control: Install Package → less
    很多使用者都需要安裝 less2css（把 less 檔案轉為 css 檔案的外掛），並且下載 lessc 安裝包到某指定位置，再將 lessc 的路徑新增到環境變數 PATH 的路徑中，如此連結所講的：https://blog.csdn.net/c_cyoxi/article/details/36947569。
    但我個人用的是 koala 軟體（把 less 檔案轉為 css 檔案的軟體，下載地址：http://koala-app.com/），我不需要安裝 less2css 和 lessc 就可以把 less 轉換為 css 檔案。
    注意：在安裝 less 後，如果之前就有書寫了的 less 檔案，不僅要把 sublime 退出重啟，還要把之前的 less 檔案關閉再次開啟才有語法高亮。

10、提示類名：關於這一點，在以下連結有很好的教程，圖文並茂，精簡詳細：https://blog.csdn.net/illa123/article/details/80568754
    注意：這個外掛並不能提示書寫 css 檔案時的 url（）中的路徑，親測。

以上是我目前會用到的外掛，希望對大家有所幫助。

最後，我有個疑問，希望有人能在下面留言回覆，非常感謝。
（疑問是：每次安裝外掛都需要 Package Control: Install Package 這一步嗎，因為第一次安裝時，這個就已經安裝了。所以能不能第一次之後的安裝外掛，直接用：Ctrl+Shift+P → 外掛名  的方法？？？求解中）

我個人對以上疑問的理解是：每次安裝都要先 install Package 回車，這是要先找到可以安裝的外掛的列表，已安裝的外掛在 install package 這一步後再在哪個輸入框中 輸入該外掛名字，就不會出現了。同樣，在解除安裝外掛的時候，步驟如下：Ctrl+Shift+P → Package Control: Remove Package → 外掛名字