image

前言

相信對于很多寫代碼的小伙伴來說,對于開發(fā)編輯器都不會陌生,什么editplus,dw,webstorm,hubuilder,vscode,atom,esciplse,vim等蘿卜青菜都各有所愛,每個編輯器都有它的獨特之處,本質(zhì)上并無優(yōu)劣之分,只要代碼寫得好,寫得快,就可以了,然而工欲善其事必先利其器,好的工具就是成功的一半,最近一直都在想著,怎么樣提高自己的效率,如果總是復(fù)性的勞動一件事情,時間久了,覺得是毫無意義的,讓自己遠離刀耕火種的時代,提高效率,同時也是為了減少手殘腰椎痛(說得好像不是搬磚的,可是我依舊是個搬磚的),那么今天就我平時的使用跟大家分享一款自己喜歡編輯器sublinmeText3,對于它的使用和學(xué)習(xí),我也一直在摸索中,初學(xué)者學(xué)習(xí)筆記使用心得,希望對正在路上的你有些用...

安裝

在sublimeText官網(wǎng)或者百度輸入下載sublimeText3下載安裝包選擇性的安裝即可(根據(jù)自己的電腦位數(shù)(32/64)選擇性安裝),建議安裝英文版的

面板使用

sublimetText3面板介紹

上方是菜單選項欄,與眾多的編輯的操作都差不多,中間是編輯區(qū)域,最右側(cè)是快速定位縮略圖,左側(cè)是代碼行號

快捷鍵

sublimeText本身具備強大的編輯能力,鍵盤俠遠比鼠標手要快得多,當(dāng)機械的重復(fù)勞動久了就顯得毫無意義,多多使用快捷鍵是提高快速編碼的一重要手段，sublimeText分為四種類別

選擇類

• Ctrl+D選中光標所占的文本,繼續(xù)操作則會選中下一個相同的的文本
• ctrl+G:輸入行號,可快速跳轉(zhuǎn)該行
• ctrl+p:輸入冒號,在輸入行號秆乳，可快速跳轉(zhuǎn)到某一行
• Alt+F3選中文本按下快捷鍵,即可一次性選擇全部相同的文本進行同時編輯:舉個例子:快速選中并更改所有相同的變量名和函數(shù)名等
• Ctrl+L:選中整行,繼續(xù)操作則繼續(xù)選擇下一行,效果和shift+向下箭頭效果一樣
• Ctrl+shift+L:先選中多行,在按下快捷鍵,會在每行行尾插入光標,即可同時編輯這行
• Ctrl+Shift+M 選擇括號內(nèi)的內(nèi)容（繼續(xù)選擇父括號）怀浆。舉個栗子：快速選中刪除函數(shù)中的代碼呜象，重寫函數(shù)體代碼或重寫括號內(nèi)里的內(nèi)容
• Ctrl+M 光標移動至括號內(nèi)結(jié)束或開始的位置
• Ctrl+Enter 在下一行插入新行。舉個栗子：即使光標不在行尾，也能快速向下插入一行
• Ctrl+Shift+Enter 在上一行插入新行火的。舉個栗子：即使光標不在行首，也能快速向上插入一行
• ctrl+shift+[:選中代碼,按下快捷鍵,折疊代碼
• ctrl+shift+]:選中代碼,按下快捷鍵,展開代碼
• Ctrl+k+0:展開所有折疊代碼
• ctrl+←:向左單位性地移動光標,快速移動光標
• ctrl+→:向右單位性移動光標,快速移動光標
• shift+↑ 向上選中多行
• shift+↓ 向下選中多行
• Shift+← 向左選中文本
• Shift+→ 向右選中文本
• Ctrl+Shift+← 向左單位性地選中文本
• Ctrl+Shift+→ 向右單位性地選中文本
• Ctrl+Shift+↑ 將光標所在行和上一行代碼互換（將光標所在行插入到上一行之前）
• Ctrl+Shift+↓ 將光標所在行和下一行代碼互換（將光標所在行插入到下一行之后）
• Ctrl+Alt+↑ 或Ctrl+Alt+鼠標向上拖動 向上添加多行光標淑倾，可同時編輯多行
• Ctrl+Alt+↓或Ctrl+Alt+鼠標向下拖動 向下添加多行光標馏鹤，可同時編輯多行
• 多重選擇
  • 多重選擇功能允許在頁面中同時存在多個光標,讓很多本來需要正則表達式,高級搜索和替換才能完成的的任務(wù)也變得游刃有余了 激活多重選擇的方法有兩及種:
  • 按住ctrl然后在頁面中希望中現(xiàn)光標的位置點擊
  • 選擇數(shù)行文本,然后按下shift+ctrl+L
  • 通過反復(fù)按下ctrl+D即可將全文中與光標當(dāng)前所在位置的詞相同的詞逐一加入選擇,而直接按下Alt+F3即可一次性選擇所有相同的詞
  • 按下鼠標中鍵來進行垂直方向的縱列選擇,也可以進入多重編輯狀態(tài)

選擇類簡單示例使用

編輯類

• Ctrl+J:合并選中多行代碼為一行:將多行格式的css屬性合并為一行
• ctrl+shift+D:復(fù)制光標所在的整行,插入到下一行
• Tab 向右縮進。只對光標后（或者選中的）的代碼有效
• Shift+Tab 向左縮進
• Ctrl+[ 向左縮進娇哆。對整行有效
• Ctrl+] 向右縮進湃累。對整行有效
• Ctrl+K+K 從光標處開始刪除代碼至行尾。按住Ctrl碍讨，按兩次K
• 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è)置書簽，F(xiàn)2切換書簽
• Ctrl+T 左右字母互換

編輯類簡單使用

搜索類

• Ctrl+F 打開底部搜索框勃黍，查找關(guān)鍵字
• 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)鍵字豆村，查找文件中的變量名液兽、屬性名等
• Esc 退出光標多行選擇，退出搜索框掌动，命令框
• Ctrl+Shift+P 打開命令框四啰。場景栗子：打開命名框，輸入關(guān)鍵字粗恢，調(diào)用sublime text或插件的功能柑晒，例如使用package安裝插件

簡單的搜索類使用示例

顯示類

• ctrl+Tab:按文件瀏覽過的順序,切換當(dāng)前窗口的標簽頁
• Ctrl+PageDown向左切換當(dāng)前窗口的標簽頁
• Ctrl+PageUp向右切換當(dāng)前窗口的標簽頁
• 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 免打擾模式
• ...
  對于實際開發(fā)中,可以看到有的大神,一個大的顯示屏是分好多屏的,在把不同的界面切來切去的,看到那老長的代碼,黑黑的界面,神秘兮兮的
  使用方法:Alt+shift+數(shù)字,qwer鍵盤上的數(shù)字

Alt+shift+數(shù)字1眷射，2,3,4,5,8,9分屏操作,注意沒有6,7

有時候你會發(fā)現(xiàn),在sublimeText中用快捷鍵,不起作用或者你安裝了一些插件,一些該調(diào)出該有功能快捷鍵,使用了卻不起作用,這是為何呢?這是因為可能安裝的插件過多,可能相互沖突了,或者與輸入法的快捷鍵沖突了,可以到插件配置中進行定制,或者查看輸入法把沖突的快捷鍵去掉就可以了..比如:以刪除整行為例:ctrl+shift+k

快捷鍵沖突解決

至于每個快捷鍵的使用,平時的學(xué)習(xí)刻意的練習(xí),開發(fā)中多用,久而久之,就熟悉了的,不用刻意去記憶,那么多快捷鍵,想要記住是不容易的,可以一階段時間分開階段的熟練的使用

插件篇

sublimeText之所以讓我喜歡的地方,一方面是它打開文件相比其他編輯器而言,非常的快,而且主色調(diào)也很詼諧,最重要的是它強大的插件機制,是占很大優(yōu)勢的,以下是我個人較為喜歡的插件匙赞，常用的在前

在安裝各種插件之前,需要安裝Package control插件在線安裝

1. 菜單欄-->view-->Show Console(ctrl+)`

2. 將下面的配置配置代碼輸入到控制臺,在線安裝即可安裝文檔

   https://packagecontrol.io/installation#st3,根據(jù)自己的sublimeText版本進行選擇安裝

3. 安裝gif圖如下:

   
   
   package control安裝
   4. 重啟Sublime Text 3
   5. 如果在Perferences->package settings中看到package control這一項，則安裝成功

利用Package Control安裝插件

• ctrl+shift+p或者菜單欄:Tools-->command palette調(diào)出命令面板, 輸入install 調(diào)出 Install Package 選項并回車妖碉，然后在列表中選中要安裝的插件,在輸入框中直接輸入插件名稱可進行搜插件,雙擊即可自動安裝,退出命令面板,在重復(fù)的按兩次ctrl+shift+p`可退回上次操作,或菜單欄上選擇命令面板

安裝插件

當(dāng)然也可以直接在github上搜,下載安裝包,直接放在package目錄下就可以了的,示例如下所示

直接把插件放到package里面就可以了的

幾種特殊的意外情況,無法使用package Control或者插件安裝不上問題解決

• 情況一:無法調(diào)出Package Control或未安裝PackageControl
  首次安裝或重新安裝的方式是一樣的涌庭，首先打開控制臺（Ctrl+~），不過Sublime Text的版本不同欧宜，執(zhí)行的命令是不一樣的
  對于Sublime Text2輸入以下命令執(zhí)行：
  import urllib2,os,hashlib; h = 'eb2297e1a458f27d836c04bb0cbaf282' + 'd0e7a3098092775ccb37ca9d6b2e4b7d'; 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()) ); by = urllib2.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); open( os.path.join( ipp, pf), 'wb' ).write(by) if dh == h else None; print('Error validating download (got %s instead of %s), please try manual install' % (dh, h) if dh != h else 'Please restart Sublime Text to finish installation')
  對于Sublime Text 3需要輸入如下的命令：
  import urllib.request,os,hashlib; h = 'eb2297e1a458f27d836c04bb0cbaf282' + 'd0e7a3098092775ccb37ca9d6b2e4b7d'; 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)
  如上動圖所示:選擇你需要的sublimeText版本選擇性安裝既然3都出來了,就不要用2了的
  執(zhí)行完后坐榆，Package Control安裝成功,此時便可以調(diào)出PackageControl命令輸入面板（Ctrl+Shift+P），輸入install
  除了使用上述命令安裝法冗茸，還可手動安裝席镀，需要的可訪問官網(wǎng)查看[手動安裝package control]https://packagecontrol.io/installation#st3

• 情況二:彈出Package Control:There are no packages available for installation

安裝錯誤的情況下

ping sublime.wbond.net

打開dos命令行終端,匹配對應(yīng)的關(guān)系

• 情況三:package Contrl下插件始終安裝不上
  Package Control：Unableto download Emmet.Please view the console for more details./Error while loading PyV8 binary:exit code 3…

在package Control無法在線安裝插件

類似這種插件無法下載的問題，一般是由于網(wǎng)速慢,或者目標域名被墻而無法正常訪問導(dǎo)致的,這種情況下扮授，首先檢查本地網(wǎng)絡(luò)是否可以訪問外網(wǎng),檢測下載速度是不是特別慢芳室，
如果網(wǎng)速太慢，換個時間再安裝,還有一個辦法是:到github或第三方網(wǎng)站手動下載安裝包刹勃，然后解壓到安裝目錄下的/Packages目錄下就可以了的
另外許多插件都依賴于Python的，在插件安裝開始時會去下載Python相關(guān)資源嚎尤，
比如荔仁，Emmet安裝就會先下載你系統(tǒng)位數(shù)一致的Python版本，我們在debug窗口可以看到這些信息

其中有兩條,表示下載失敗，原因一般是網(wǎng)速慢請求超時或被墻了,換個時間在下載安裝把

pyv8下載失敗彈框提示

如何查找已安裝的插件,去除插件

同樣調(diào)出命令行面板ctrl+shift+p或者菜單欄Tools-->command Palette,拉動滾動條,可以查看插件所有的命令快捷操作,列出插件(list Packages),移除插件(remove Package)等落萎，以Alignment對齊代碼插件為例:先移除后安裝,其他插件雷同,在線移除插件過程需要等待一段時間,移除后,可在preferences-->Package settings中插件插件的有無,第二種去除插件的方法就是直接去packages中間的插件文件夾刪除掉就可以了的,一旦去除插件,對應(yīng)的快捷鍵操作就消失了的

去除插件

1. Alignment(代碼對齊）

一個非常簡單和易于使用的插件,使你的代碼組織和美觀亥啦。當(dāng)你重溫代碼時候非常有用.

使用方法：選中要調(diào)整的行，然后按 Ctrl+ Alt + A (若是插件的快捷鍵與電腦中某些軟件的快捷鍵沖突,那么可以自定義快捷鍵),當(dāng)然對齊格式化代碼,最好的插件還有別的,比如HTML-CSS-JS Prettify

對齊代碼

2. HTML-CSS-JS Prettify

使用說明：快速格式化html css js 快捷鍵：ctrl+shift+h也可以鼠標右鍵操作, 安裝插件后练链，直接使用時沒有效果的,會提示nodejs not fount,安裝好該插件后并不可以直接使用,需要添加nodejs的安裝位置于插件中

• 查看本地安裝的NodeJS配置環(huán)境路徑（window+R->cmd->在dos命令下翔脱，輸入where node并回車）或者git 壞境里,或者是直接找到node安裝文件位置

查看node安裝位置

• 在編輯器的任意一個html/js/css文件中，右擊媒鼓，出現(xiàn)如下圖所示届吁，選擇Set Plugin Options,HTMLPretty.sublime-settings，將node_path中的window路徑更改為node的安裝位置的路徑即可,如下圖所示

更改插件中node的位置

• 要注意的是路徑斜線
• 設(shè)置完后就可以直接右鍵使用了

3. Emmet

Emmet絕對的節(jié)省時間,可減少重復(fù)的體力勞動,您可以輕松快速地編寫HTML,CSS,使用方法: ctrl + alt + enter ,并且開始輸入Emmet風(fēng)格的,只要清晰結(jié)構(gòu),鏈式的寫法+tab鍵就可以

<div class="container">
        <ul class="img">
            <li><img src="images/1.jpg" alt="" width="700" height="400"></li>
            <li><img src="images/2.jpg" alt="" width="700" height="400"></li>
            <li><img src="images/3.jpg" alt="" width="700" height="400"></li>
            <li><img src="images/4.jpg" alt="" width="700" height="400"></li>
            <li><img src="images/5.jpg" alt="" width="700" height="400"></li>
        </ul>
        <ul class="nav">
            <li>1</li>
            <li>2</li>
            <li>3</li>
            <li>4</li>
            <li>5</li>
            <li class="bg"></li>
        </ul>
</div>

利用emmet快速生成html結(jié)構(gòu)比如：如上結(jié)構(gòu)div.container>ul.img>li*5>img[src="images/$.jpg"][width="700"][height="400"]^^ul.nav>li{$}*5绿鸣，這里的大于號相當(dāng)于css中的子選擇器,進入下一級,可以計算,聯(lián)想css中的選擇器使用,就覺得不神奇了,只要清晰布局結(jié)構(gòu),就可以快速寫html,而css的編寫,只要知道元素屬性,無需寫全,按一下tab鍵就會自動補全了,比如:常見的meta標簽:meta:vp,meta:utf,link:css,link:favicon,cc:ie6,cc:ie,cc:noie``,-transition,-box-shadow....更多內(nèi)容可參考手冊,是由規(guī)律可尋找的.

利用emmet快速生成html結(jié)構(gòu)

快速的編寫css

快速的編寫css

至于更多的豐富的emmet的使用可參考官網(wǎng)的APIemmetAPI疚沐，不得不說真的很強大,大大的解放了勞動力

4. SublimeTmpl 快速生成文件模板

SublimeTmpl 能新建 html、css潮模、javascript濒旦、php、python再登、ruby 六種類型的文件模板尔邓，所有的文件模板都在插件目錄的templates文件夾里，可以自定義編輯文件模板锉矢，生成自己所需要的,一次性的配好模板,無需重復(fù)的輸入一些毫無意義的勞動梯嗽，一勞永益

SublimeTmpl默認的快捷鍵
ctrl+alt+h → html
ctrl+alt+j → javascript
ctrl+alt+c → css
ctrl+alt+p → php
ctrl+alt+r → ruby
ctrl+alt+shift+p → python

配置自己個有的模板信息:

1. preferemces-->package settings-->sublimeTmpl-->setting default按照格式進行配置添加自己想要的信息

2. preferemces-->Browser packages-->SublimeTmpl-->templates-->xxx.tmpl

快速配置模板

5.cssRem安裝

自動將px轉(zhuǎn)化為rem的插件,做移動端網(wǎng)站,rem布局時,該插件就很方便了

安裝好后,設(shè)置基準值:"px_to_rem": 數(shù)值,我這里設(shè)置是100也就是100px=1rem，具體得設(shè)置值根據(jù)你的適配而定

利用cssrem插件快速的px-to-rem

6. sass,less安裝

文件保存scss格式,按ctrl+B,可直接將scss編譯成css(在sublime中目錄中支持中文路經(jīng),但是在koala中存儲的scss目錄文件不能帶有中文,否則編譯時就會出錯,不過目錄名都命名為英文),不過這里有意思的是:與koala對比,若css中使用@rem:xxrem;在sublime中卻編譯不過,而在koala中,是可以編譯通過的

7. SublimeOnSaveBuild保存自動編譯

保存自動編譯 SublimeOnSaveBuild(如果沒有安裝這個插件,每次都要手動的重新編譯一次,ctrl+B),通過sass,less編譯的css一般都是壓縮的,在一行顯示,若想要換行顯示,右鍵執(zhí)行run csscomb,讓css自動排序

運行run csscomb格式化css代碼

8. Autoprefixer

CSS3 私有前綴自動補全插件沽损，顯然也是很有用的

設(shè)置快捷鍵灯节，選擇菜單Preferences > Key Bindings – User ,按照規(guī)則,將下面代碼添加到里面去

{ "keys": ["ctrl+alt+shift+p"], "command": "autoprefixer" }

Autoprefixer

9. Colorpicker取色器插件

使用一個取色器改變顏色 使用方法: ctrl + shift + c

colorpicker取色器

10. JsFormat

js序列化,還是很好用的

11.DocBlockr

DocBlocker 是在Sublime平臺上開發(fā)一款自動補全代碼插件，支持JavaScript (including ES6), PHP, ActionScript, Haxe, CoffeeScript, TypeScript, Java, Apex, Groovy, Objective C, C, C++ and Rust.等眾多語言

12. Tagify,Tag

標簽匹配,HTML/XML標簽縮進绵估、補全和校驗

13.BracketHighlighter

類似于代碼匹配炎疆，可以匹配括號，引號等符號內(nèi)的范圍(示例代碼中最左側(cè)的花括號),這個覺得也很重要,當(dāng)缺一個匹配時,左側(cè)一邊會有一個問號提示国裳，非常人性化

14. autofilename

自動關(guān)聯(lián)圖片,css,js等資源路徑插件

autofilename自動關(guān)聯(lián)資源

15. MarkdownEditing(markdown編輯插件),markdown Preview(markdown預(yù)覽插件,也即是在瀏覽器預(yù)覽)

• 快捷使用方式:ctrl+B他會將markdown文件轉(zhuǎn)換為html格式,直接打開就可以了,每次寫完一次,若想看到新的效果,需要每次ctrl+B編譯一次,刷新瀏覽器可以看到最新的效果(安裝了自動保存編譯的插件代替ctrl+B),但是不知道為什么無效
• 默認的markdown的皮膚真的不辣眼睛,不會在愛了的,其實markdown的是可以調(diào)整的,可以根據(jù)你自己的喜好,風(fēng)格選一款適合自己的,在sublimeText中寫markdown,在也不用什么Typora,markdown Edit桌面端應(yīng)用軟件了

markdown皮膚更改

• 當(dāng)然sublimeText相比較atom而言,美中不足的就是在編輯器中實時預(yù)覽,但是markdown文檔通過ctrl+B可以轉(zhuǎn)換為html格式文件,在瀏覽器中打開,會發(fā)現(xiàn)它的色調(diào)也不是很好看,那么怎么更改呢?既然是html文件,直接更改樣式屬性就好了,如下gif所示

更改頁面中的色調(diào),換成自己的風(fēng)格

16. Javascript-API-Completions:支持Javascript形入、JQuery

Bootstrap框架、HTML5標簽屬性提示性的插件缝左，是少數(shù)支持sublime text 3的后綴提示的插件,HTML5標簽提示sublime text3自帶亿遂，不過JQuery提示還是很有用處的浓若，也可設(shè)置要提示的語言

17. translate-CN中英互譯插件

無論是css中的class,Id,js中命名是件很糾結(jié)的事情,有了這個插件可以隨時的在編輯器中進行中英互譯,不必退出軟去瀏覽器找百度,Google翻譯,或者是打開電腦安裝的翻譯應(yīng)用軟件,真的很好用,有時不會那么快,關(guān)閉那些占高寬帶的應(yīng)用,速度會好些的,注意以上的所有插件安裝和現(xiàn)在的翻譯,是在有網(wǎng)絡(luò)的條件下才可以進行的,也就是說能看得了島國動作大片，刷得了韓國歐巴才可以愉快的玩耍,當(dāng)然已經(jīng)裝好的插件,至于有網(wǎng)沒有網(wǎng)無所謂了的,但是凡要訪問獲取外網(wǎng)數(shù)據(jù)的,另當(dāng)別論,只有在有網(wǎng)的條件才可以

選中所要翻譯的詞匯-->鼠標右鍵--Translate-CN--current text(當(dāng)前文本)/input text(調(diào)出輸入框面板可手動輸入查找翻譯)

translsate-CN中英互譯插件

18. WakaTime 記錄你Code時間

WakaTime可以做到精確地統(tǒng)計到你花在某個項目上的時間;WakaTime針對不同的IDE,擁有不同的插件,在Sublime上安裝著插件,就能統(tǒng)計到我使用Sublime進行的所有項目的行為.可以高效管理和知曉自己code時間,并且,統(tǒng)計完善, 記得有一次看到群里的一伙伴曬出來,瞬間感覺B格高了,最近也一直在用,自己用用還挺可以,可以知道一天當(dāng)中哪些代碼塊寫得量,有助于調(diào)整自己的進度,約束自己

具體使用:先安裝該插件后:preferences --->packages settings-->wakaTime-->wakaTime dashboard

沒有賬號的,注冊一個賬號登陸即可,在這個過程中,會得到一個api_key,將后面的一串字符串輸入到安裝該插件時提示的控制臺輸入即可,也可以自己配置在wakaTime的settings user中以對象字面量的方式配置一下就可以了的

wakaTime記錄code時間

總結(jié)

關(guān)于sublimeText的內(nèi)容就先介紹到這,主要介紹sublimeText本身的一些常用的快捷鍵使用和插件的使用,它只是眾多開發(fā)編輯中的一個工具而已,眾多的快捷鍵配合插件的使用,真的很強大,我覺得一定程度上是可以解放體力勞動的,之前,我忽略快捷鍵和插件的使用,總覺得那些快捷鍵記起來是負擔(dān),插件也沒有什么,寫代碼的速度一直提不上去,但是現(xiàn)在,我覺得能偷懶就要偷懶,刻意的讓自己去多用,重復(fù)性的勞動是長久以往,是毫無意義的,對于sublimeText這一神器,新的東西還有自己待續(xù)發(fā)掘...菜鳥一直行走在路上

以下是本篇提點概要

• sublimeText3的安裝
• sublimeText3快捷鍵(選擇類,編輯類,搜索類,顯示類)
• sublimeText插件篇
  • 利用Package Control安裝插件
  • 如何查找已安裝的插件,去除插件(兩種方法,在線安裝(推薦),github等其他渠道搜,package下拷貝)
  • Alignment(代碼對齊):快捷鍵:ctrl+Alt+A,也可以自己自定義
  • HTML-CSS-JS Prettify:代碼格式化(鼠標右鍵選該項即可)
  • Emmet插件(最為強大)emmetAPIemmetAPI點擊即可查看
  • SublimeTmpl 快速生成文件模板
  • cssRem安裝,與px轉(zhuǎn)化rem
  • sass,less安裝(上文中以sass為例,less同理)
  • SublimeOnSaveBuild保存自動編譯
  • Autoprefixer
  • Colorpicker取色器插件
  • JsFormatjs序列化
  • DocBlockrSublime平臺上開發(fā)一款自動補全代碼插件
  • Tagify, Tag 標簽匹配,HTML/XML標簽縮進蛇数、補全和校驗
  • BracketHighlighter類似于代碼匹配挪钓，可以匹配括號
  • autofilename自動關(guān)聯(lián)圖片,css,js等資源路徑插件
  • MarkdownEditing(markdown編輯插件),markdown Preview(markdown預(yù)覽插件,也即是在瀏覽器預(yù)覽)
  • Javascript-API-Completions支持Javascript、JQuery
  • translate-CN中英互譯插件
  • WakaTime 記錄你Code時間