sublime 插件配置與說明

##一些前端程式必備的 Sublime Text 2 Plugins

　

Alignment

<a href="http://wbond.net/sublime_packages/alignment" target="_blank">http://wbond.net/sublime_packages/alignment</a>

自動對齊選取範圍內 code 的等號。

EX：

var test1 = 123456789

var test10 = 123456

var test100 = 123

var test1000 = 1

↓

var test1    = 123456789

var test10   = 123456

var test100  = 123

var test1000 = 1

【Package Control】

Ctrl+Shift+P→「Package Control:Install Package」→「Alignment」

【熱鍵】

OS X     ：Cmd+Ctrl+A

Win/Linux：Ctrl+Alt+A

—

All Autocomplete

<a href="https://github.com/alienhard/SublimeAllAutocomplete" target="_blank">https://github.com/alienhard/SublimeAllAutocomplete</a>

在編輯當前的檔案時，提示所有「打開中的檔案」的函數。

Ctrl+Shift+P→「Package Control:Install Package」→「All Autocomplete」

BracketHighlighter

<a href="https://github.com/facelessuser/BracketHighlighter" target="_blank">https://github.com/facelessuser/BracketHighlighter</a>

大括號、中括號、所有括號家族高亮比對。

Ctrl+Shift+P→「Package Control:Install Package」→「BracketHighlighter」

Browser Refresh

<a href="https://github.com/gcollazo/BrowserRefresh-Sublime" target="_blank">https://github.com/gcollazo/BrowserRefresh-Sublime</a>

重新整理瀏覽器目前開啟的前景頁面。

Ctrl+Shift+P→「Package Control:Install Package」→「Browser Refresh」

OS X     ：Cmd+Shift+R

Win/Linux：Ctrl+Shift+R

Change Quotes

<a href="https://github.com/colinta/SublimeChangeQuotes" target="_blank">https://github.com/colinta/SublimeChangeQuotes</a>

單引號變雙引號，或反過來。

Ctrl+Shift+P→「Package Control:Install Package」→「Change Quotes」

Clipboard History

<a href="https://github.com/kemayo/sublime-text-2-clipboard-history" target="_blank">https://github.com/kemayo/sublime-text-2-clipboard-history</a>

剪貼簿工具，自動記錄多筆複製的內容。

Ctrl+Shift+P→「Package Control:Install Package」→「Clipboard History」

【熱鍵】打開複製和剪下的記錄面闆

OS X     ：Cmd+Ctrl+Alt+V

Win/Linux：Ctrl+Alt+V

（有裝 Evernote 的話熱鍵會相撞，記得改。）

ColorPicker

<a href="https://github.com/weslly/ColorPicker" target="_blank">https://github.com/weslly/ColorPicker</a>

開啟調色盤選取色碼，或選取色碼看/改顏色。

Ctrl+Shift+P→「Package Control:Install Package」→「ColorPicker」

OS X     ：super+Shift+C

Win/Linux：Ctrl+Shift+C

Compass

<a href="https://github.com/WhatWeDo/Sublime-Text-2-Compass-Build-System" target="_blank">https://github.com/WhatWeDo/Sublime-Text-2-Compass-Build-System</a>

Ctrl+Shift+P→「Package Control:Install Package」→「Compass」

ConvertToUTF8

<a href="https://github.com/seanliang/ConvertToUTF8" target="_blank">https://github.com/seanliang/ConvertToUTF8</a>

將開啟的檔案編碼自動轉換成 UTF-8，編輯並儲存目前編碼不被 Sublime Text 2 支援的檔案，特別是中日韓用戶使用的 GB2312，GBK，BIG5，EUC-KR，EUC-JP 等。

Ctrl+Shift+P→「Package Control:Install Package」→「ConvertToUTF8」

DeleteBlankLines

<a href="https://github.com/NicholasBuse/sublime_DeleteBlankLines" target="_blank">https://github.com/NicholasBuse/sublime_DeleteBlankLines</a>

刪除空白行。

Ctrl+Shift+P→「Package Control:Install Package」→「DeleteBlankLines」

【熱鍵】刪除選取範圍內的空白行

OS X     ：Ctrl+Alt+Delete

Win/Linux：Ctrl+Alt+Backspace

【熱鍵】刪除剩餘的空白行

OS X     ：Ctrl+Alt+Shift+Delete

Win/Linux：Ctrl+Alt+Shift+Backspace

Emmet

<a href="https://github.com/sergeche/emmet-sublime" target="_blank">https://github.com/sergeche/emmet-sublime</a>

ex-Zen Coding

Ctrl+Shift+P→「Package Control:Install Package」→「Emmet」

Gis

<a href="https://github.com/condemil/Gist" target="_blank">https://github.com/condemil/Gist</a>

友善的進行建立、搜尋插入、更新以及版本控制的代碼片段管理器。

Ctrl+Shift+P→「Package Control:Install Package」→「Gis」

【教學】

<a href="http://lucifr.com/2012/03/07/sublime-text-2-plus-gist-equal-snippet-manager/" target="_blank">http://lucifr.com/2012/03/07/sublime-text-2-plus-gist-equal-snippet-manager/</a>

Goto-CSS-Declaration

<a href="https://github.com/rmaksim/Sublime-Text-2-Goto-CSS-Declaration" target="_blank">https://github.com/rmaksim/Sublime-Text-2-Goto-CSS-Declaration</a>

跳到所在的 CSS

Ctrl+Shift+P→「Package Control:Install Package」→「Goto-CSS-Declaration」

OS X     ：Cmd+right／Cmd+left

Win/Linux：win+.／win+,

HTML5

<a href="https://github.com/mrmartineau/HTML5" target="_blank">https://github.com/mrmartineau/HTML5</a>

HTML5 提示

Ctrl+Shift+P→「Package Control:Install Package」→「HTML5」

IMESupport

<a href="https://github.com/chikatoike/IMESupport" target="_blank">https://github.com/chikatoike/IMESupport</a>

在 windows 環境下，讓 Sublime Text 2 在輸入中文時，輸入框可以跟隨編輯區的光標位置直接打字。（超級必備！）

Ctrl+Shift+P→「Package Control:Install Package」→「IMESupport」

JsFormat

<a href="https://github.com/jdc0589/JsFormat" target="_blank">https://github.com/jdc0589/JsFormat</a>

將選取範圍內的 javascript 格式化。

Ctrl+Shift+P→「Package Control:Install Package」→「JsFormat」

OS X     ：Ctrl+Alt+F

Win/Linux：Ctrl+Alt+F

jQuery

<a href="https://github.com/SublimeText/jQuery" target="_blank">https://github.com/SublimeText/jQuery</a>

jQuery 提示

Ctrl+Shift+P→「Package Control:Install Package」→「jQuery」

KeymapManager

<a href="https://github.com/welefen/KeymapManager" target="_blank">https://github.com/welefen/KeymapManager</a>

熱鍵快查，把安裝的 Packages 的熱鍵（Key Bindings – Default）列出來。

Ctrl+Shift+P→「Package Control:Install Package」→「KeymapManager」

OS X     ：Ctrl+Alt+K

Win/Linux：Ctrl+Alt+K

LoremIpsum

<a href="https://github.com/billymoon/LoremIpsum" target="_blank">https://github.com/billymoon/LoremIpsum</a>

英文假字產生器

Ctrl+Shift+P→「Package Control:Install Package」→「LoremIpsum」

【插入假字】

Edit → Text → Lorem Ipsum…

Markdown Preview

<a href="https://github.com/revolunet/sublimetext-markdown-preview" target="_blank">https://github.com/revolunet/sublimetext-markdown-preview</a>

預覽 Markdown

Ctrl+Shift+P→「Package Control:Install Package」→「Markdown Preview」

【預覽方式】

Ctrl+Shift+P 指令 →

「Markdown Preview: current file in browser」

- 在默認瀏覽器中對當前 Markdown 檔案進行預覽。

「Markdown Preview: current file in Sublime Text」

- 在 Sublime Text 2 中產生 HTML 代碼。

Open Folder

<a href="https://github.com/mikepfirrmann/openfolder" target="_blank">https://github.com/mikepfirrmann/openfolder</a>

在 sidebar 的右鍵選單新增「Open Folder」選項，可開啟資料夾或用預設程式開啟圖片等。

Ctrl+Shift+P→「Package Control:Install Package」→「Open Folder」

Open URL

<a href="https://github.com/noahcoad/open-url" target="_blank">https://github.com/noahcoad/open-url</a>

開啟文檔中的網址或本地檔案路徑。

Ctrl+Shift+P→「Package Control:Install Package」→「Open URL」

OS X     ：Ctrl+U

Win/Linux：Ctrl+U

PlainTasks

<a href="https://github.com/aziz/PlainTasks" target="_blank">https://github.com/aziz/PlainTasks</a>

把 Sublime Text 2 當作工作表來用。

Ctrl+Shift+P→「Package Control:Install Package」→「PlainTasks」

【熱鍵】添加新任務

OS X     ：Cmd+Enter／Cmd+I

Win/Linux：Ctrl+Enter／Ctrl+I

【熱鍵】將一個任務標記為完成／將一個完成的任務恢復為未完成

OS X     ：Cmd+D／Cmd+滑鼠左鍵

Win/Linux：Ctrl+D／Ctrl+滑鼠左鍵

【熱鍵】將已完成任務歸檔到文檔結尾的 Archive 項目中

OS X     ：Cmd+Shift+A

Win/Linux：Ctrl+Shift+A

【熱鍵】插入分隔線 —- ———————————-

OS X     ：輸入兩個「-」並按下 tab 鍵

Win/Linux：輸入兩個「-」並按下 tab 鍵

【熱鍵】設為標題

OS X     ：以半形冒號「:」結尾

Win/Linux：以半形冒號「:」結尾

RenameTab

<a href="https://github.com/frozenice-/RenameTab" target="_blank">https://github.com/frozenice-/RenameTab</a>

重新命名當前未存檔的頁籤

Ctrl+Shift+P→「Package Control:Install Package」→「RenameTab」

OS X     ：Alt+W

Win/Linux：Alt+W

Sass

<a href="https://github.com/nathos/sass-textmate-bundle" target="_blank">https://github.com/nathos/sass-textmate-bundle</a>

SASS 提示、語法高亮

Ctrl+Shift+P→「Package Control:Install Package」→「Sass」

SFTP

<a href="http://wbond.net/sublime_packages/sftp" target="_blank">http://wbond.net/sublime_packages/sftp</a>

就是加上 SFTP 和 FTP 等功能。

Ctrl+Shift+P→「Package Control:Install Package」→「SFTP」

【專案 FTP 設定】

在專案資料夾按右鍵 →「SFTP/FTP」→「Add Remote Mapping…」

{

   // sftp 或 ftp

   “type”: “ftp”,

   //上傳前存檔

   “save_before_upload”: true,

   //存檔立刻上傳

   “upload_on_save”: false,

   //開啟時同步遠端到本地

   “sync_down_on_open”: false,

   //同步時跳過刪除的檔案

   “sync_skip_deletes”: false,

   //開啟「下載確認」

   “confirm_downloads”: false,

   //開啟「同步確認」

   “confirm_sync”: true,

   //開啟「複寫確認」

   “confirm_overwrite_newer”: false,

   //主機

   “host”: “xxx.xxx.xxx.xxx”,

   //帳號

   “user”: “xxxxxxxx”,

   //密碼

   “password”: “xxxxxxxx”,

   //連接埠

   “port”: “21”,

   //遠端資料夾路徑

   “remote_path”: “/public_html/”,

   //略過的檔案或資料夾

   “ignore_regexes”: [

    ”\.sublime-(project|workspace)”, “sftp-config(-Alt\d?)?\.json”,

    ”sftp-settings\.json”, “/venv/”, “\.svn”, “\.hg”, “\.git”,

     “\.bzr”, “_darcs”, “CVS”, “\.DS_Store”,

     “Thumbs\.db”, “desktop\.ini”

   ]

}

【熱鍵】上傳檔案

OS X     ：Ctrl+Cmd+u+F

Win/Linux：Ctrl+Alt+u+F

【熱鍵】上傳改過的檔案

OS X     ：Ctrl+Cmd+u+C

Win/Linux：Ctrl+Alt+u+C

【熱鍵】上傳開啟的檔案

OS X     ：Ctrl+Cmd+U+N

Win/Linux：Ctrl+Alt+U+N

【熱鍵】下載檔案

OS X     ：Ctrl+Cmd+U+O

Win/Linux：Ctrl+Alt+U+O

【熱鍵】上傳當前檔案所在的資料夾

OS X     ：Ctrl+Cmd+u+R

Win/Linux：Ctrl+Alt+u+R

【熱鍵】下載當前檔案所在的資料夾

OS X     ：Ctrl+Cmd+U+E

Win/Linux：Ctrl+Alt+U+E

【熱鍵】diff 遠端檔案

OS X     ：Ctrl+Cmd+U+I

Win/Linux：Ctrl+Alt+U+I

【熱鍵】同步本地到遠端

OS X     ：Ctrl+Cmd+U+Y

Win/Linux：Ctrl+Alt+U+Y

【熱鍵】同步遠端到本地

OS X     ：Ctrl+Cmd+U+D

Win/Linux：Ctrl+Alt+U+D

【熱鍵】雙向同步

OS X     ：Ctrl+Cmd+U+B

Win/Linux：Ctrl+Alt+U+B

【熱鍵】監視檔案

OS X     ：Ctrl+Cmd+U+M

Win/Linux：Ctrl+Alt+U+M

【熱鍵】瀏覽遠端

OS X     ：Ctrl+Cmd+U+W

Win/Linux：Ctrl+Alt+U+W

【熱鍵】設定 Server

OS X     ：Ctrl+Cmd+R+S

Win/Linux：Ctrl+Alt+R+S

【熱鍵】瀏覽 Server

OS X     ：Ctrl+Cmd+R+B

Win/Linux：Ctrl+Alt+R+B

【熱鍵】顯示最後一個使用的 Server

OS X     ：Ctrl+Cmd+R+N

Win/Linux：Ctrl+Alt+R+N

【熱鍵】編輯 Server

OS X     ：Ctrl+Cmd+R+E

Win/Linux：Ctrl+Alt+R+E

【熱鍵】刪除 Server

OS X     ：Ctrl+Cmd+R+D

Win/Linux：Ctrl+Alt+R+D

【熱鍵】顯示 SFTP 面闆

OS X     ：Ctrl+Cmd+U+S

Win/Linux：Ctrl+Alt+U+S

【熱鍵】停止

OS X     ：Ctrl+Cmd+U+X

Win/Linux：Ctrl+Alt+U+X

SideBarEnhancements

<a href="https://github.com/titoBouzout/SideBarEnhancements" target="_blank">https://github.com/titoBouzout/SideBarEnhancements</a>

增強 Sublime Text 2 sidebar 右鍵選單的功能

Ctrl+Shift+P→「Package Control:Install Package」→「SideBarEnhancements」

【編輯專案的網址】

在專案資料夾按右鍵 →「Project」→「Edit Projects Preview URLs」

   //專案一路徑

   “C:/XXX/XXX/XXX”:{

     //測試網址

     “url_testing”:”http://testing”,

     //正式網址

     “url_production”:”http://domain.tld”

   },

   //專案二路徑

     “C:/XXX/XXX/XXX”:{

  }

【熱鍵】開啟測試網址

OS X     ：F12

Win/Linux：F12

【熱鍵】開啟正式網址

OS X     ：Alt+F12

Win/Linux：Alt+F12

SublimeCodeIntel

<a href="https://github.com/Kronuz/SublimeCodeIntel" target="_blank">https://github.com/Kronuz/SublimeCodeIntel</a>

PHP, Python, RHTML, JavaScript, Smarty, Mason, Node.js, XBL, Tcl, HTML, HTML5, TemplateToolkit, XUL, Django, Perl, Ruby, Python3 提示

Ctrl+Shift+P→「Package Control:Install Package」→「SublimeCodeIntel」

SublimeLinter

<a href="https://github.com/SublimeLinter/SublimeLinter" target="_blank">https://github.com/SublimeLinter/SublimeLinter</a>

智能錯誤提示

Ctrl+Shift+P→「Package Control:Install Package」→「SublimeLinter」

Tag

<a href="https://github.com/SublimeText/Tag" target="_blank">https://github.com/SublimeText/Tag</a>

HTML 優化

Ctrl+Shift+P→「Package Control:Install Package」→「Tag」

【熱鍵】HTML 格式化

OS X     ：Cmd+Alt+F

Win/Linux：Alt+F

【熱鍵】把選中的字變 ＜選中的字＞＜/選中的字＞

OS X     ：Ctrl+Shift+,

Win/Linux：Ctrl+Shift+,

Wordpress

<a href="https://github.com/purplefish32/sublime-text-2-wordpress" target="_blank">https://github.com/purplefish32/sublime-text-2-wordpress</a>

Wordpress 提示

Ctrl+Shift+P→「Package Control:Install Package」→「Wordpress」

Theme - Phoenix

<a href="http://netatoo.github.com/phoenix-theme" target="_blank">http://netatoo.github.com/phoenix-theme</a>

好看的主題

Ctrl+Shift+P→「Package Control:Install Package」→「Theme - Phoenix」

Theme - Soda

<a href="http://buymeasoda.github.com/soda-theme" target="_blank">http://buymeasoda.github.com/soda-theme</a>

Ctrl+Shift+P→「Package Control:Install Package」→「Theme - Soda」