Sublime Text 3的經常使用插件的安裝和介紹

Sublime Text 3的插件安裝流程

一、安裝Sublime Text 3

二、Package Control組件在線安裝：

     按Ctrl+`或者點擊View 下的show console調出console框，複製一下代碼，按回車鍵

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，則安裝成功。

五、利用Package Control安裝插件

       按下Ctrl+Shift+P調出命令面板，輸入install 調出 Install Package 選項並回車，而後在列表中選中要安裝的插件

Sublime Text 3的幾款經常使用的插件

一、ChineseLocalizations   漢化插件  ------  可進行語言切換

二、Emmet（原名 Zen Coding）  -------   可快速編寫代碼

例如：輸入「!」或「html:5」，而後按Tab鍵，就會將html5基本標籤顯示出來，其餘還有不少快捷方式，想了解的能夠去查閱一下Emmet

三、BracketHighlighter   --------   相似於代碼匹配，能夠匹配括號，引號等符號內的範圍

四、cssrem  ------- 自動將CSS的px值轉rem值

 在wepapp開發時,使用rem進行移動端適配的時候，很是好用，省下不少計算的時間。

 五、Alignment  ------- 自動對齊代碼，包括PHP、CSS、JavaScript語言。使得代碼看起來更整齊美觀，更具可讀性

  默認快捷鍵爲ctrl + alt + a,若是跟某IM截圖的快捷鍵衝突，可在Preferences->Package Settings->Alignment->Key Bindings - User中自定義快捷鍵，寫法參照Key Bindings - Default

六、Css Format  -----  css格式化

   很快捷的將css的格式進行切換，Expand（標準格式化），Compact（css一行行顯示），Compressed（css壓縮成一行）

七、DocBlockr  ------  觀察函數須要的變量名和類型，並建立文檔塊，只要在函數的上面輸入/**，按Tab就能夠了

八、SublimeCodeIntel   ------- 一個全功能的 Sublime Text 代碼自動完成引擎

支持的語言挺多的（JavaScript, Mason, XBL, XUL, RHTML, SCSS, Python, HTML, Ruby, Python3, XML, Sass, XSLT, Django, HTML5, Perl, CSS, Twig, Less, Smarty, Node.js, Tcl, TemplateToolkit, PHP.）

九、AutoFileName  -------   自動補全文件路徑

十、Autoprefixer   -------  應用css的瀏覽器兼容書寫，自動分析你的css文件，解析出新的css文件

十一、JavaScript Completions   -------  js最基本的api快查片斷

十二、minify   -------  壓縮和美化html,css,js文件

由於minify利用的是nodejs進行的，因此使用minify須要安裝nodejs,同時須要全局安裝以下：

npm install -g clean-css-cli uglifycss js-beautify html-minifier uglify-js minjson svgo