Sublime Text 3 安裝、插件與我的配置

Sublime Text 是程序員們公認的編碼神奇，擁有漂亮的用戶界面和強大的功能，例如代碼縮略圖，多重選擇，快捷命令等。還可自定義鍵綁定，菜單和工具欄。Sublime Text 的主要功能包括：拼寫檢查，書籤，即時項目切換，多選擇，多窗口等等。

更重要的是，Sublime Text 易於擴展，衆多開發人員爲其貢獻插件，並且經過包管理工具——Package Control 能夠方便安裝和管理。這裏分享的這個網站是 Package Control 的做者整理的 Sublime Text 插件集合，前端開發的民工們不再用去網上一個個找了。趕忙收藏起來吧。

Sublime Text的安裝與使用

官網：http://www.sublimetext.com/

安裝Package Control

首先經過快捷鍵 ctrl+` 或者 View > Show Console 打開控制檯，而後粘貼相應的 Python 安裝代碼。

Sublime Text 2 安裝代碼：

import urllib2,os; 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( ))); open( os.path.join( ipp, pf), 'wb' ).write( urllib2.urlopen( 'http://sublime.wbond.net/' +pf.replace( ' ','%20' )).read()); print( 'Please restart Sublime Text to finish installation')

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必備插件

• Emmet

Emmet 項目的前身是前端開發人員熟知的 Zen Coding（快速編寫 HTML/CSS 代碼的方案）。在 Sublime Text 編輯器中搭配 Emmet 插件真的是讓你編碼快上加快。

• Alignment

代碼對齊插件(=號對齊)：變量定義太多，長短不一，可一鍵對齊。默認快捷鍵Ctrl+Alt+A和QQ截屏衝突，可設置其餘快捷鍵如：Ctrl+Shift+Alt+A；先選擇要對齊的文本

• AutoFileName

快捷輸入文件名：自動完成文件名的輸入，如圖片選取。使用：輸入」/」便可看到相對於本項目文件夾的其餘文件

• Bracket​Highlighter

括號高亮匹配；

• Bracket Highlighter

代碼匹配插件：可匹配[], (), {}, 「」, 」, ，高亮標記，便於查看起始和結束標記

• jQuery

代碼智能提示插件：快捷輸入jQ函數，是偷懶的好方法

• Js​Format

JavaScript 代碼格式化插件：在已壓縮的JS文件中，右鍵選擇jsFormat或者使用默認快捷鍵（Ctrl+Alt+F）

• CssFormat

Css 代碼格式化插件：在css文件中，右鍵選擇cssFormat

• DocBlockr

生成優美註釋：若是你遵循的編碼的風格很嚴格，這款插件可以使你的任務更容易。DocBlokr 幫助你創造你的代碼註釋，經過解析功能，參數，變量，而且自動添加基本項目。輸入/*、/**而後回車，還有不少用法，請參照https://sublime.wbond.net/packages/DocBlockr

• ConvertToUTF8

文件轉碼成utf-8：經過本插件，您能夠編輯並保存目前編碼不被 Sublime Text 支持的文件，特別是中日韓用戶使用的 GB2312，GBK，BIG5，EUC-KR，EUC-JP ，ANSI等。ConvertToUTF8 同時支持 Sublime Text 2 和 3。安裝插件後文件自動轉換爲utf-8格式。

• Trailing spaces

檢測並一鍵去除代碼中多餘的空格，讓你的代碼規範清爽起來。一鍵刪除多餘空格：CTRL+SHITF+T（需配置），更多配置請點擊標題。快捷鍵配置：在Preferences / Key Bindings – User加上代碼（數組內）

• MarkdownPreview

使用瀏覽器來preview效果，安裝完後你即可以用sublime來編寫Markdown語法了並使用瀏覽器預覽了。當你想查看效果的時候，鍵入ctrl + shift + p，控制板中鍵入Markdown，選擇preview in browser，再選擇github。這時候效果就會在顯示器中顯示了。

• Sublime CodeIntel

代碼自動提示插件

• Sublime​Linter

代碼校驗插件：一個支持lint語法的插件，能夠高亮linter認爲有錯誤的代碼行，也支持高亮一些特別的註釋，好比「TODO」，這樣就能夠被快速定位。安裝教程：https://gaohaoyang.github.io/2015/03/26/sublimeLinter/

安裝方法：

1.按下 Ctrl+Shift+p 進入 Command Palette
2.輸入install進入Package Control: Install Package
3.輸入`SublimeLinter`安裝Linter
4.輸入`SublimeLinter-jshint`安裝jshint
5.輸入`SublimeLinter-csslint`安裝csslint
6.下載並安裝[Node.js](https://nodejs.org/en/)
7.打開命令行，輸入`sudo npm install -g jshint`，經過 npm 安裝 jshint
8.輸入`jshint -v`，查看 jshint 版本，已確認jshint安裝完成
9.打開命令行，輸入`sudo npm install -g csslint`，經過 npm 安裝 csslint
10.輸入`csslint --version`，查看 csslint 版本，已確認 csslint 安裝完成

Sublime Text選裝插件

• Color​Picker

跨平臺取色器插件：一般，若是你想使用一個顏色選擇器則可能打開 Photoshop 或 GIMP。而在 Sublime Text 中，你可使用內置的顏色選擇器。安裝完成後，只要按下Ctrl / Cmd + Shift + C 快捷鍵。

• Git

整合 Git 功能的插件：在工做中，版本控制軟件最經常使用的軟件之一，而最流行的 VCS 是 Git。你是否厭倦了保存文本文件，並切換回終端運行一些 Git 命令。若是你能從文本編輯器自己執行 Git 命令，豈不是很好？

• GitGutter

Sublime Text 有了 Git 插件以後，GitGutter 更好的幫助開發者查看文件以前的改動和差別，提高開發效率。

• LESS

LESS高亮插件：用LESS的同窗都知道，sublime沒有支持less的語法高亮，因此這個插件能夠幫上咱們

• Nodejs

node代碼提示：教程：https://sublime.wbond.net/packages/Nodejs

• FileDiffs

強大的比較代碼不一樣工具：比較當前文件與選中的代碼、剪切板中代碼、另外一文件、未保存文件之間的差異。可配置爲顯示差異在外部比較工具，精確到行。使用：右鍵標籤頁，出現FileDiffs Menu或者Diff with Tab…選擇對應文件比較便可

Sublime Text 配色方案

• Material Theme

很漂亮的一款sublime主題，看着很舒服，護眼。

Sublime Text 編程字體

• Source Code Pro

下載地址：https://github.com/adobe-fonts/source-code-pro