sublime Text3 前端常用外掛
– File Switching （檔案切換）
— Sublime Text提供了一個非常快速的方式來開啟新的檔案。只要按下Ctrl+ P並開始輸入你想要開啟的檔案的名稱。一旦找到檔案，只需按enter鍵，就可以開始直接輸入到該檔案了！
– Goto Symbols （跳轉標記）
— 當你編輯一個大檔案時，檔案中有一堆方法，按`Ctrl + R將其全部列出來，使他們更容易找到。開始嘗試的輸入你想要的，然後按Enter 就可以快速跳轉這個方法了。
– Package Control 包控制安裝
簡單的控制檯安裝方法：
最簡單的安裝方法是通過 Sublime Text 控制檯。控制檯可以通過 ctrl +` 快捷方式 或 View > Show Console 選單來開啟/關閉。 開啟後，將適用於你 Sublime Text 版本的 Python 程式碼貼上到控制檯中。
/Sublime Text 3 包控制安裝程式碼/
import urllib.request,os,hashlib; h = `df21e130d211cfc94d9b0905775a7c0f` + `1e3d39e33b79698005270310898eea76`; 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)
/Sublime Text 2 包控制安裝程式碼/
import urllib2,os,hashlib; h = `df21e130d211cfc94d9b0905775a7c0f` + `1e3d39e33b79698005270310898eea76`; pf = `Package Control.sublime-package`; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler()) ); by = urllib2.urlopen( `http://packagecontrol.io/` + pf.replace(` `, `%20`)).read(); dh = hashlib.sha256(by).hexdigest(); open( os.path.join( ipp, pf), `wb` ).write(by) if dh == h else None; print(`Error validating download (got %s instead of %s), please try manual install` % (dh, h) if dh != h else `Please restart Sublime Text to finish installation`)
通過Package Control 包控制安裝外掛
Package Control（包控制）是安裝下面列出的所有外掛和主題的最佳方式。繼續，在包控制中安裝外掛。通過 Package Control（包控制）安裝外掛和主題很簡單：
使用方法：進入命令皮膚（ctrl + shift+ p），然後鍵入 install。
然後鍵入 remove 刪除。
– localization
— 漢化
– Emmet
Emmet絕對的節省時間。您可以輕鬆快速地編寫HTML。
– BracketHighlighter
— 該外掛提供行數列高亮的各種配對的語法符號。（愚人碼頭注：就是將配對的括號等顯示在行數列上
– Colorpicker
— 使用一個取色器改變顏色
使用方法: ctrl + shift + c
– DocBlockr
— 一個真正簡單的方式來輕鬆地建立許多語言包括JavaScript，PHP和CoffeeScript的文件塊。只要在函式的上面輸入/**，按Tab就可以了。DocBlockr會觀察函式需要的變數名和型別，並建立文件塊。
– SidebarEnhancements
— 擴充套件檔案樹右鍵功能
– CSSComb
— 用來給CSS屬性進行排序的格式化
注：因為Csscomb的快捷鍵是shift+ctrl+c，可能與其他快捷鍵衝突
你可以去Preferences–>外掛設定–>CssComb–>key-Bindings-Defallut設定
– ColorHighlighter
— 它可以展示你所選擇的顏色程式碼（像“#FFFFFF”, “rgb(255,255,255)”, “white”）的真正顏色。同時它還包含一個顏色選擇器讓你可以方便地更改顏色。
— 使用：快捷鍵Windows: ctrl+shift+w
– Trailing spaces
— 功能：檢測並一鍵去除程式碼中多餘的空格
使用：安裝外掛並重啟，即可自動提示多餘空格。一鍵刪除多餘空格：CTRL+SHITF+T（需配置）
快捷鍵配置：在Preferences / Key Bindings – User加上程式碼（陣列內）{ “keys”: [“ctrl+shift+t”], “command”: “delete_trailing_spaces” },
– auto-save
— 功能：自動儲存檔案
使用：預設是不會自動儲存，按快捷鍵Ctrl+Shift+S開啟。
快捷鍵配置方法：首選項-快捷鍵設定，在陣列內新增{ “keys”: [“ctrl+shift+s”], “command”: “auto_save” },如需自動啟用，首選項-外掛-auto-save—settings-usre粘帖一下配置
{
“auto_save_on_modified”: true,
“auto_save_delay_in_seconds”: 10,
“auto_save_all_files”: true,
“auto_save_current_file”: “”,
“auto_save_backup”: false,
“auto_save_backup_suffix”: “autosave”
}
– view in browser
— 功能：通過預設瀏覽器開啟檔案
使用：快捷鍵配置方法：首選項-快捷鍵設定，在陣列內新增快捷鍵：{ “keys”: [“f12”], “command”: “open_in_browser” },
– autoprefixer
— 功能：CSS新增私有字首
簡介：CSS還未標準化，所以要給各大瀏覽器一個字首以解決相容問題
使用：快捷鍵配置方法：首選項-快捷鍵設定，在陣列內新增{ “keys”: [“ctrl+shift+enter”], “command”: “autoprefixer” },
快捷鍵：ctrl+shift+enter
– CSS Extended Completions
— 功能：關聯CSS檔案，智慧提示css檔案中的類名，非常好用
– JavaScript Completions
— 功能：支援javascript原生語法提示
– jQuery
— 功能：jQ函式提示
簡介：快捷輸入jQ函式，是偷懶的好方法
– AutoFileName
— 功能：快捷輸入檔名
簡介：自動完成檔名的輸入，如圖片選取
使用：輸入”/”即可看到相對於本專案資料夾的其他檔案
– HTML-CSS-JS Prettify
— 功能：快捷輸入檔名
簡介: 編輯HTML, CSS, JS時，經常會出現縮排不對，程式碼行不對其的情況。裝了這個外掛之後，只要按下 Ctrl+Shift+h (Windows), Command+Shift+h (Mac), 你的文件就會被整理乾淨。
注: 需要配置node檔案路徑 HTML-CSS-JS Prettify > plugin Options