Sublime text3 常用插件說明,快捷鍵以及安裝

1、安裝Package Control

Package Control為插件管理包,所以我們首先要安裝它。有了它,我們就可以很方便的瀏覽、安裝和卸載Sublime Text中的插件。

安裝方式一:

組合鍵 Ctrl+Shift+P 調出命令面板 ------>輸入 ipc ,選擇Install Package Control --------->耐心等待幾秒鐘,直到出現下框,表示安裝成功。


20180803003050758.png

安裝方式二:

按Ctrl+ `(此符號為tab按鍵上面的按鍵) 調出console
粘貼以下代碼到命令行并回車

import urllib.request,os,hashlib; h = '6f4c264a24d933ce70df5dedcf1dcaee' + 'ebe013ee18cced0ef93d5f746d80ef60'; 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 3”,點開菜單“Preferences(首選項)”可見“Package Control”項,說明插件管理包已安裝成功。
安裝Package Controlh后即可輕松愉快的安裝其他插件了。

2、安裝其他插件

同樣有兩種方式:

A:下載完整的插件包后解壓,下載地址:https://github.com/seanliang/ConvertToUTF8

,下載后解壓放入 Sublime Text 3安裝目錄的Packages 文件夾下,以達到安裝插件的目的。
如何找到 Packages 目錄:雙擊打開你的 “Sublime Text 3”,點菜欄 “Preferences(首選項)--->Browse Packages(瀏覽插件目錄)”。

B:快捷鍵 Ctrl+Shift+p ,打開 “Command Palette” 懸浮對話框,在頂部輸入 “Install”, 然后下選點擊 “Package Control:Install Package”。

在出現的懸浮對話框中輸入你想安裝的插件名, 找到回車,就自動開始安裝,請耐心等待。
當插件安裝成功后,Sublime Text 3 會有類似下圖的安裝成功的提示。

如圖:
2018080301162251.png

3、這里以第二種方式來詳解安裝的插件

注意:安裝插件時保持網絡暢通,避免插件由于網絡原因奔潰
快捷鍵 Ctrl+Shift+p ,打開 “Command Palette” 懸浮對話框,在頂部輸入 “Install”, 然后下選點擊 “Package Control:Install Package”。輸入安裝的插件名稱

安裝中文插件ChineseLocalizations,讓sublime以中文界面顯示

安裝完后再help language里面設置中文即可。

Emmet(原名 Zen Coding),一種快速編寫html/css的方法。

安裝Emmet的同時,也會自動安裝其依賴PyV8 binary庫,安裝PyV8庫會用較長時間,可以在Sublime左下角看到安裝進程狀態

html5 , 支持hmtl5規范的插件包,

與Emmet插件配合使用,效果更好
使用方法:新建html文檔>輸入html5>敲擊Tab鍵>自動補全html5規范文檔

JSFormat,JS代碼格式化插件。

使用方法:使用快捷鍵ctrl+alt+f

SublimeLinter

一個支持lint語法的插件,可以高亮linter認為有錯誤的代碼行,也支持高亮一些特別的注釋

Alignment ,代碼對齊,

如寫幾個變量,選中這幾行,快捷鍵:Ctrl+Alt+A。

Ctags ,函數跳轉,

Alt+點擊 函數名稱,會跳轉到相應的函數

Doc?Blockr ,注釋插件

生成優美的注釋。標準的注釋,包括函數名、參數、返回值等,并以多行顯示,省去手動編寫。
使用參考:https://www.cnblogs.com/knyel/p/7850127.html

HTMLBeautify,HTML格式化插件

ColorHighlighter 插件

功能說明:顯示所選顏色值的顏色,并集成了ColorPicker

AutoFileName 插件

功能說明:自動補全文件(目錄)名。

SublimeCodeIntel

功能說明:智能提示

View In Browser

功能說明:Sublime Text保存后網頁自動同步更新。

jQuery

功能:jQ函數提示
簡介:快捷輸入jQ函數,是偷懶的好方法

autoprefixer

功能:CSS添加私有前綴
簡介:CSS還未標準化,所以要給各大瀏覽器一個前綴以解決兼容問題
私有前綴自動補全插件,寫 CSS 可自動添加 -webkit 等私有詞綴,Ctrl+Alt+X 觸發。
需要安裝Node.js

cssrem 將px自動轉為rem

下載cssrem 下載地址:https://github.com/hyb628/cssrem
把解壓后的 cssrem 或者 cssrem-master 拷貝到 Packages 目錄下
重啟sublime text 3 就會找到下列目錄

647286-20170502162249836-1821012094.png

點擊進去修改里面的代碼為

"px_to_rem": 40, //px轉rem的單位比例,默認為40
"max_rem_fraction_length": 6, //px轉rem的小數部分的最大長度。默認為6。
"available_file_types": [".css", ".less", ".sass",".html"]
//啟用此插件的文件類型。默認為:[".css", ".less", ".sass"]
}

重啟sublime text 3 新建一個css文件寫樣式測試就ok了。

安裝sublimeServer

安裝完成之后,點擊菜單欄的Tools選項,就可以看到SublimeServer工具

說一下為什么在sublime中安裝服務器插件:出于安全性考慮,本地頁面ajax()請求本地頁面,須通過服務器環境運行。

如何使用

1、啟動插件: Tools => SublimeServer => start SublimeServer
2、右擊編輯器內容 => view in SublimeServer

個人常用插件大概就是這些,其他插件大家可以按需自己安裝。

歡迎大家聯系,一起交流、探討、學習~

公眾號:大橙子的雜貨鋪,歡迎掃碼關注
掃一掃加微信,有問題多交流
最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。