Sublime Text簡介
Sublime Text - 性感的代碼編輯器舔哪、程序員之必備神器
Sublime Text 是一個代碼編輯器,也是HTML和散文先進的文本編輯器。Sublime Text具有漂亮的用戶界面和強大的功能渊抽,例如代碼縮略圖,Python的插件瓶籽,代碼段等恃鞋。還可自定義鍵綁定崖媚,菜單和工具欄。SublimeText的主要功能包括:拼寫檢查恤浪,書簽畅哑,完整的 Python API , Goto 功能水由,即時項目切換荠呐,多選擇,多窗口等等砂客。SublimeText是一個跨平臺的編輯器泥张,同時支持Windows、Linux鞠值、Mac OS X等操作系統(tǒng)媚创。
安裝Sublime Text 3插件的方法:
直接安裝
安裝Sublime text 3插件很方便,可以直接下載安裝包解壓縮到Packages目錄(菜單->preferences->packages)彤恶。
使用package control安裝
網(wǎng)址(https://packagecontrol.io/installation#Simple)
package control 是用來安裝其它插件的插件钞钙,為了方便管理插件的插件,可以安裝刪除其他插件
這個特殊的“插件包”声离,可以很容易地安裝芒炼、升級、刪除抵恋,甚至非常方便地查看您已經(jīng)安裝在SublimeText中的包或插件的列表焕议。它通過菜單和對應(yīng)的行為使這些過程變得非常容易和有組織。
1. 按Ctrl+`或View>Show Console調(diào)出console
2. 粘貼以下代碼到底部命令行并回車:
?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)
3. 重啟Sublime Text 3。
4. 如果在Perferences->package settings中看到package control這一項盅安,則安裝成功唤锉。在Perferences下面會多出package settings和package control兩個選項。
如果由于某種原因别瞭,控制臺安裝不成功(如在您的網(wǎng)絡(luò)上有一個代理)窿祥,請執(zhí)行以下步驟來手動安裝Package Control:
1. 點擊Preferences>Browse Packages…
2. 瀏覽文件夾,進入Installed Packages/
3. 下載Package Control.sublime-package復(fù)制到Installed Packages/
4. 重啟 Sublime Text
用Package Control安裝插件方法:
首先進入package control 的官網(wǎng)(https://packagecontrol.io/),找到自己想要的插件蝙寨,將插件的名字復(fù)制下來晒衩,然后去sublime里面去安裝
1. 按下Ctrl+Shift+P調(diào)出命令面板
2. 輸入install 或package調(diào)出 Install Package 選項并回車,輸入剛才找好的插件名稱墙歪,然后在列表中選中要安裝的插件听系。
常用Sublime Text 3插件:
1.Emmet
編輯器中最流行的插件之一。Emmet虹菲,前身Zen Coding也是web開發(fā)者提高生產(chǎn)力最有效的方法之一靠胜。按下Tab鍵,Emmet就能把一個縮寫展開成一個HTML和CSS代碼塊毕源,Emmet的使用方法(http://docs.emmet.io/cheat-sheet/),Emmet官網(wǎng),Emmet package control.
解決Sublime提示 Sublime Text Error while loading PyV8 binary:exit code 1 Try to manually install Pyv8 form https://github.com/emetio/pyv8-binaries
1. 去gihub下載 PyV8,連接地址:https://github.com/emmetio/pyv8-binaries
2.?解壓文件至Packages\PyV8文件夾內(nèi)(Preferences – Browser Packages)浪漠,重啟解決。
側(cè)邊欄顏色與主題一致
這個插件可以給SublimeText的邊欄菜單帶來擴充的功能霎褐,包括:在當(dāng)前工程文件夾中新建文件址愿,移動文件或文件夾,產(chǎn)生文件或文件夾的副本冻璃,在新窗口或瀏覽器中打開响谓,刷新等。
自動補全文件路徑-非常方便俱饿。
如果你經(jīng)常要查看或設(shè)置顏色值歌粥,這個插件可以很方便地調(diào)用你本機的調(diào)色板應(yīng)用。
Sublime text3 插件ColorPicker(調(diào)色板)不能使用快捷鍵的解決方法
convertToUTF8和ColorPicker快捷鍵會產(chǎn)生沖突拍埠,convertoUTF8的默認轉(zhuǎn)換GBK的快捷鍵 和 ColorPicker打開調(diào)色板的快捷鍵都是ctrl+shift+c?失驶。如果你兩個插件都安裝了的話,就需要進行自定義了枣购。
解決方法:打開Sublime Text --> Preferences --> Browse Packages嬉探,找到ConvertToUTF8文件夾并進入,找到對應(yīng)操作系統(tǒng)的Default.sublime-keymap文件棉圈,直接修改成?
[
{ "keys": ["ctrl+shift++alt+c"], "command": "convert_to_utf8", "args": {"encoding": "GBK", "stamp": "0" } }
]
現(xiàn)在我正在使用的主題與配色
使用方法
Open your User Settings Preferences fileSublime Text -> Preferences -> Settings - User
Add (or update) your theme entry to be"theme": "Soda Light 3.sublime-theme"or"theme": "Soda Dark 3.sublime-theme"
7.Piatto
piatto light配色方案很好看
通過本插件涩堤,您可以編輯并保存目前編碼不被 Sublime Text 支持的文件,特別是中日韓用戶使用的 GB2312分瘾,GBK胎围,BIG5,EUC-KR,EUC-JP 等白魂。ConvertToUTF8 同時支持 Sublime Text 2 和 3汽纤。
11.?IMESupport
還在糾結(jié) Sublime Text 中文輸入法不能跟隨光標(biāo)嗎?試試「IMESupport 」這個插件吧福荸!目前只支持 Windows蕴坪,在搜索等界面不能很好的跟隨光標(biāo)。
12.?jQuery
提供jquery的一些snippets片段 敬锐,方便直接調(diào)用
配色方案很好看,但是有一點暗了
14.?html5
該插件提供許多 html5相關(guān)的標(biāo)簽等snippets背传,也非常實用。
crtl+shift+p 輸入相關(guān)內(nèi)容台夺,可以看到有代碼片段径玖,后面是其快捷鍵
15.Js?Format
在你寫javascript代碼時,按下?Ctrl+Alt+f?快捷鍵后,js代碼自動格式化對齊,趕快試一試吧!
括號以及標(biāo)簽層級顯示,不用擔(dān)心選中的代碼屬于哪個代碼塊谒养,一目了然挺狰。
Sublime Text 默認的 Autocomplete 功能只考慮當(dāng)前的文件,而 AllAutocomplete 插件會搜索所有打開的文件來尋找匹配的提示詞买窟。
21.?PHPCS?
23.Doc?Blockr
可以生成優(yōu)美的注釋,高效的注釋
24.AngularJS
AngularJs 補全
25.SVG-Snippets
SVG-Snippets - 設(shè)置自定義的SVG片段薯定。
26.CSS Format
有多種css格式化風(fēng)格
使用方法始绍,安裝完成后,在Edit中找到CSS Format,選擇相應(yīng)格式
27.A File Icon
文件圖標(biāo)
可以讓sublime有javascript語法檢查话侄。
安裝方法:
1. 安裝SublimeLinter插件(?通過Package Control 來安裝)
2. 安裝Node.js
node -v ? 輸出版本信息亏推,驗證安裝是否成功。
3. 安裝jshint
SublimeLinter-jshint 是基于 nodeJS 下的 jshint 的插件年堆,實際上 SublimeLinter-jshint 調(diào)用了 nodeJS 中 jshint 的接口來進行語法檢查的吞杭。
在命令行下輸入如下代碼:npm install -g jshint完成安裝
4. 安裝好了上面的依賴后,在Package Control中搜索SublimeLinter-jshint插件变丧,然后確認安裝芽狗。
Sublime?Linter-csslint是用來檢查css錯誤的,安裝方法類似于SublimeLinter-jshint
安裝方法:
?1. 安裝SublimeLinter插件( 通過Package Control 來安裝)
?2. 安裝Node.js
?3. 安裝csslint
在命令行下輸入如下代碼:npm install -g csslint完成安裝
4. 安裝好了上面的依賴后痒蓬,在Package Control中搜索SublimeLinter-csslint插件童擎,然后確認安裝。
Emmet Css Snippets是可以自動提示CSS攻晒、LESS和SASS語法的sublime text插件顾复。
它的特點有:
可以自動提示CSS、LESS和SASS語法鲁捏。
有兩個版本:has-Prefix 或 no-Prefix芯砸。
智能自動完成。
可以提示偽元素。
可以提示擴展屬性假丧。
語法參考:http://p233.github.io/Emmet-Css-Snippets-for-Sublime-Text-2/
31.Terminal
在當(dāng)前文件打開終端
使vue后綴的代碼文件高亮
markdown編輯支持高亮
34.scss
支持scss高亮
Sublime Text 如何關(guān)閉自動更新末购?
點擊菜單欄“Preferences”=> "Settings-User" 進入個人參數(shù)設(shè)置頁面;在大括號"{}"里面插入下面代碼:"update_check": false, 保存就行了
Sublime主題
在設(shè)置一個新的主題時虎谢,需要設(shè)置color_scheme和theme兩個方面盟榴,前者決定了打開不同類型文件的配色,后者決定了Tab欄婴噩,SideBar大小和圖標(biāo)擎场,以及相應(yīng)字體的大小設(shè)置。
?sublime 主題(theme)與配色方案(color_scheme),激活主題几莽,不激活主題迅办,使用的只是配色文字,Sublime Text -> Preferences -> Settings - User
Add (or update) your theme entry to be"theme": "XXX.sublime-theme"
查看已安裝插件
快捷鍵 Ctrl+Shift+P章蚣,在對話框中輸入“l(fā)ist”站欺,選擇“Package Control:List Packages”。
Sublime會列出所有已安裝的插件纤垂。這樣可以很方便地了解自己已經(jīng)安裝了哪些插件矾策。
Disable?Package:禁用插件
enable?Package:啟用插件
Install?Package:安裝插件
List?Package:查看已安裝插件列表
Remove?Package:移除插件
Upgrade?Package:升級插件
移除插件
有時候我們需要移除自己不想要的插件,具體操作如下:快捷鍵 Ctrl+Shift+P峭沦,在對話框中輸入“remove”贾虽,選擇“Package Control: Remove Packages”。 然后在出現(xiàn)的插件列表中點選你要移除的插件吼鱼。
自定義Sublime
Perferences - Settings-Default中是sublime的默認設(shè)置蓬豁,Settings-user是用戶用來自定義設(shè)置的,自定義只需復(fù)制Settings-Default中的值菇肃,粘貼在Settings-User中改變其值就行了地粪,
如復(fù)制"line_numbers": true,粘貼在Setttings-User將true改為false保存則行號消失。
側(cè)邊欄的顯示與隱藏
剛安裝好的sublime側(cè)邊欄是不顯示的琐谤,顯示的方法是:View > Side Bar > Show Open Files.
Sublime改變默認字體
sublime text的默認字體是Consolas
改變默認字體:?Preferences-Settings-User
如改變字體為微軟雅黑添加:"font_face": "Microsoft YaHei",
Sublime中增加格式化代碼的快捷鍵
其實在sublime中已經(jīng)自建了格式化按鈕:
Edit -> Line -> Reindent
只是sublime并沒有給他賦予快捷鍵蟆技,所以只需加上快捷鍵即可
Preference -> Key Bindings -user?
中括號內(nèi)添加(比如添加:ctrl + alt + f)
{ "keys": ["ctrl+alt+f"], "command": "reindent" }
創(chuàng)建可復(fù)用的代碼片段
我們在編寫代碼的時候,總會遇到一些需要反復(fù)使用的代碼片段笑跛。這時候就需要反復(fù)的復(fù)制和黏貼付魔,大大影響效率。我們利用Sublime Text的snippet功能飞蹂,就能很好的解決這一問題几苍。通俗的講,就是把我們常用的代碼分別保存起啦陈哑,然后通過插件的形式來反復(fù)調(diào)用妻坝。
在菜單上點擊Tools -> New Snippet伸眶,會新建一個xml文件頁簽:
這時你會看到如下示例代碼:
<snippet>
?????<content><![CDATA[
Hello, ${1:this} is a ${2:snippet}.
]]></content>
?????<!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
?????<!-- Optional: Set a scope to limit where the snippet will trigger -->
?????<!-- <scope>source.python</scope> -->
</snippet>
content 里面就是代碼模版:${序號:默認值} ,序號相同的地方光標(biāo)會同時停在那可以多處同時編輯刽宪。序號大小就是tabindex厘贼。在實際使用代碼的時候,可以使用tab切換光標(biāo)位置圣拄。
tabTrigger是指輸入該字符串后tab就是在光標(biāo)插入content中的內(nèi)容嘴秸。
scope是指在何種文件類型中使用,如<scope>text.html</scope>則定義了僅在html文件中使用,所以此時如果我們打開的是css或其他格式的文件庇谆,那將無法插入代碼段岳掐。
現(xiàn)在,你應(yīng)該有了個大致的了解饭耳。那我們就開始自己動手編寫一個實例:
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="author" content="loveyunk" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<title>${1}</title>
</head>
<body>
Hello, ${2:this} is a ${3:snippet}.
</body>
</html>
]]>
html5
創(chuàng)建完畢以后串述,保存在\Packages\User目錄下(例 X:\Sublime Text\Data\Packages\User),后綴名.sublime-snippet寞肖。
此時我們打開一個html文件纲酗,輸入html5,再按Tab鍵新蟆,剛才我們所編寫的代碼段觅赊,就插入了進來。并且此時的光標(biāo)停留在我們所標(biāo)記的${1}位置處栅葡,如果我們再按下Tab茉兰,那么光標(biāo)就跳轉(zhuǎn)到${2}的位置。this會被選中欣簇。
Sublime Text 小技巧
1. 一般推薦下載便攜版本(Portable version),這樣拿來拿去很方便坯约,也不用安裝熊咽,而且插件和主體在一個目錄下,便攜闹丐。
2. 查找打開過的文件:Ctrl+P横殴,然后輸入最近的文件名通過上下箭頭鍵就可以即時預(yù)覽到文件內(nèi)容。
3. 快速切換語法模式:CTRL+SHIFT+P卿拴,輸入JS衫仑,回車切換語法模式為JS模式,css回車堕花,則切換為css模式文狱,主要是找到set Syntax: 選項
4.?文件嵌套較多時用GoTo Anything(快捷鍵 ctrl + p)來查找,符號功能:css文件中輸入@搜出所有的css,在css中添加屬性可以采用模糊匹配的方法(其中的幾個字母)缘挽,js中@可以查找函數(shù)
5.?Ctrl+D :選擇游標(biāo)所在單詞瞄崇,連續(xù)Ctrl+D 實現(xiàn)多行選擇(選擇與第一次選擇相同的單詞)Ctrl+K Ctrl+D 跳過當(dāng)前選擇呻粹,選擇下一個,ctrl+D-->Atl+F3全選匹配內(nèi)容
6. Soda 主題+ Piatto Light 配色方案
7. 按住鼠標(biāo)中鍵往下拉苏研,可同時進行多行編輯
sublime代碼折疊展開
Ctrl+Shift+[ 折疊代碼
Ctrl+Shift+] 展開代碼
Sublime Text 3快捷鍵
選擇類
Ctrl+D 選中光標(biāo)所占的文本等浊,繼續(xù)操作則會選中下一個相同的文本。
Alt+F3 選中文本按下快捷鍵摹蘑,即可一次性選擇全部的相同文本進行同時編輯筹燕。舉個栗子:快速選中并更改所有相同的變量名、函數(shù)名等衅鹿。
Ctrl+L 選中整行撒踪,繼續(xù)操作則繼續(xù)選擇下一行,效果和 Shift+↓ 效果一樣塘安。
Ctrl+Shift+L 先選中多行糠涛,再按下快捷鍵,會在每行行尾插入光標(biāo)兼犯,即可同時編輯這些行忍捡。
Ctrl+Shift+M 選擇括號內(nèi)的內(nèi)容(繼續(xù)選擇父括號)。舉個栗子:快速選中刪除函數(shù)中的代碼切黔,重寫函數(shù)體代碼或重寫括號內(nèi)里的內(nèi)容砸脊。
Ctrl+M 光標(biāo)移動至括號內(nèi)結(jié)束或開始的位置。
Ctrl+Enter 在下一行插入新行纬霞。舉個栗子:即使光標(biāo)不在行尾凌埂,也能快速向下插入一行。
Ctrl+Shift+Enter 在上一行插入新行诗芜。舉個栗子:即使光標(biāo)不在行首瞳抓,也能快速向上插入一行。
Ctrl+Shift+[ 選中代碼伏恐,按下快捷鍵孩哑,折疊代碼。
Ctrl+Shift+] 選中代碼翠桦,按下快捷鍵横蜒,展開代碼。
Ctrl+K+0 展開所有折疊代碼销凑。
Ctrl+← 向左單位性地移動光標(biāo)丛晌,快速移動光標(biāo)。
Ctrl+→ 向右單位性地移動光標(biāo)斗幼,快速移動光標(biāo)澎蛛。
shift+↑ 向上選中多行。
shift+↓ 向下選中多行孟岛。
Shift+← 向左選中文本瓶竭。
Shift+→ 向右選中文本督勺。
Ctrl+Shift+← 向左單位性地選中文本。
Ctrl+Shift+→ 向右單位性地選中文本斤贰。
Ctrl+Shift+↑ 將光標(biāo)所在行和上一行代碼互換(將光標(biāo)所在行插入到上一行之前)智哀。
Ctrl+Shift+↓ 將光標(biāo)所在行和下一行代碼互換(將光標(biāo)所在行插入到下一行之后)。
Ctrl+Alt+↑ 向上添加多行光標(biāo)荧恍,可同時編輯多行瓷叫。
Ctrl+Alt+↓ 向下添加多行光標(biāo),可同時編輯多行送巡。
編輯類
Ctrl+J 合并選中的多行代碼為一行摹菠。舉個栗子:將多行格式的CSS屬性合并為一行。
Ctrl+Shift+D? 復(fù)制光標(biāo)所在整行骗爆,插入到下一行次氨。
Tab 向右縮進。
Shift+Tab 向左縮進摘投。
Ctrl+K+K 從光標(biāo)處開始刪除代碼至行尾煮寡。
Ctrl+Shift+K 刪除整行。
Ctrl+/ 注釋單行犀呼。
Ctrl+Shift+/ 注釋多行幸撕。
Ctrl+K+U 轉(zhuǎn)換大寫。
Ctrl+K+L 轉(zhuǎn)換小寫外臂。
Ctrl+Z 撤銷坐儿。
Ctrl+Y 恢復(fù)撤銷。
Ctrl+U 軟撤銷宋光,感覺和 Gtrl+Z 一樣貌矿。
Ctrl+F2 設(shè)置書簽
Ctrl+T 左右字母互換。
F6 單詞檢測拼寫
搜索類
Ctrl+F?打開底部搜索框罪佳,查找關(guān)鍵字站叼。
Ctrl+H?查找與替換。
Ctrl+shift+F 在文件夾內(nèi)查找菇民,與普通編輯器不同的地方是sublime允許添加多個文件夾進行查找,略高端投储,未研究第练。
Ctrl+P?打開搜索框。舉個栗子:1玛荞、輸入當(dāng)前項目中的文件名娇掏,快速搜索文件,2勋眯、輸入@和關(guān)鍵字婴梧,查找文件中函數(shù)名下梢,3、輸入:和數(shù)字塞蹭,跳轉(zhuǎn)到文件中該行代碼孽江,4、輸入#和關(guān)鍵字番电,查找變量名岗屏。
Ctrl+G 打開搜索框,自動帶:漱办,輸入數(shù)字跳轉(zhuǎn)到該行代碼这刷。舉個栗子:在頁面代碼比較長的文件中快速定位。
Ctrl+R?打開搜索框娩井,自動帶@暇屋,輸入關(guān)鍵字,查找文件中的函數(shù)名洞辣。舉個栗子:在函數(shù)較多的頁面快速查找某個函數(shù)咐刨。
Ctrl+: 打開搜索框,自動帶#屋彪,輸入關(guān)鍵字所宰,查找文件中的變量名、屬性名等畜挥。
Ctrl+Shift+P?打開命令框仔粥。場景栗子:打開命名框,輸入關(guān)鍵字蟹但,調(diào)用sublime text或插件的功能躯泰,例如使用package安裝插件。
Esc 退出光標(biāo)多行選擇华糖,退出搜索框麦向,命令框等。
顯示類
Ctrl+Tab 按文件瀏覽過的順序客叉,切換當(dāng)前窗口的標(biāo)簽頁诵竭。
Ctrl+PageDown 向左切換當(dāng)前窗口的標(biāo)簽頁。
Ctrl+PageUp 向右切換當(dāng)前窗口的標(biāo)簽頁兼搏。
Alt+Shift+1 窗口分屏卵慰,恢復(fù)默認1屏(非小鍵盤的數(shù)字)
Alt+Shift+2 左右分屏-2列
Alt+Shift+3 左右分屏-3列
Alt+Shift+4 左右分屏-4列
Alt+Shift+5 等分4屏
Alt+Shift+8 垂直分屏-2屏
Alt+Shift+9 垂直分屏-3屏
Ctrl+K+B 開啟/關(guān)閉側(cè)邊欄。
F11 全屏模式
Shift+F11 免打擾模式
Sublime Text 中英文對照