sublime text3安裝以及插件配置教程

本文是安裝的Sublime Text3是portable version(可移動(dòng)版本) ,安裝的環(huán)境是基于window 7 或者window 8.1。主要介紹sublime text3 的安裝,漢化,常用插件的安裝和使用!

一、下載安裝sublime Text3

到官網(wǎng)http://www.sublimetext.com/3下載安裝包(根據(jù)你的電腦系統(tǒng)下載對(duì)應(yīng)的portable version),下載好st3后,然后不斷的點(diǎn)擊next,然后blablabla……就可以安裝好了(我的系統(tǒng)的window8.1 64位,安裝的目錄D盤)

二、漢化sbulime Text3

安裝完sublime text3 后,發(fā)現(xiàn)都是英文,四級(jí)沒過的同學(xué)怎么辦,當(dāng)然是漢化!

2.1下載漢化安裝包

地址:http://pan.baidu.com/s/1qWnBNvI

2.2安裝漢化包(將漢化包拷到 Installed Packages 文件夾中)

進(jìn)入:D:\Sublime Text3\Data\Installed Packages(根據(jù)你的安裝目錄去尋找Installed Packages,本文是安裝在D盤),將剛剛下載的漢化包解壓,得到的文件Default.sublime-package 拷貝到 Installed Packages 文件夾中,這個(gè)時(shí)候就會(huì)發(fā)現(xiàn)漢化成功啦!

三、安裝Package Control

Package Control非常重要,因?yàn)檫@關(guān)系到后面的st3 安裝包的使用,而Package Control 的安裝有兩種方法:

3.1通過控制面板安裝

①點(diǎn)擊工具欄的“查看”->”顯示面板”(快捷鍵 是”ctrl+`”),

②到https://packagecontrol.io/installation官網(wǎng),將對(duì)應(yīng)的代碼拷貝到顯示面板中,然后回車。如果安裝成功,那么就顯示Package Settings 和Package Control 這兩個(gè)項(xiàng),

如果沒有安裝成功,那么建議用手動(dòng)安裝

3.2通過手動(dòng)安裝

①到https://packagecontrol.io/installation官網(wǎng),右邊有一個(gè)“Package Control.sublime-package”,點(diǎn)擊下載,然后將文件拷貝到 Installed Packages文件夾中

四、安裝st3常用的插件

對(duì)于st3,它之所以輕巧,是因?yàn)樗O(shè)計(jì)就是為了讓你按需加載,根據(jù)自己的需要,去下載對(duì)應(yīng)的插件,所以才不會(huì)像其他的IDE那樣笨重。安裝插件步驟是:“Preferences -> Package Control”(快捷鍵是:shift+ctrl+p),然后執(zhí)行“Package Control: Install Package”,接在就是輸入你要安裝的插件就可以,下面就說一下你個(gè)人常用的插件:

1、Emmet

作用:快速編寫HTML,CSS代碼

示例:html:5+tab,div#box+tab

2、SublimeCodeIntel

作用:代碼提示插件,可以幫你補(bǔ)全代碼,快速方便書寫!大大提升效率!

示例:

3、jQuery

作用:在使用jQuery的時(shí)候,給出對(duì)應(yīng)的方法和API的提示!

示例:

4、Alignment

作用:該插件是用來對(duì)齊的,當(dāng)你在寫js的時(shí)候,為了代碼的美觀,就需要用到這個(gè)插件!

快捷鍵:默認(rèn)的是:ctrl+alt+a(與qq截圖剛好沖突,建議修改)

示例:

5、DocBlocker

作用:快熟書寫注釋!

示例:

6、Jsformat

作用:js壓縮文件的還原,但是遺憾的是變量名稱是

快捷鍵:默認(rèn)的是:ctrl+alt+f

示例:

7、Bracket Highlighter

作用:當(dāng)你鼠標(biāo)選中標(biāo)簽或者是某個(gè)片段代碼的時(shí)候,對(duì)應(yīng)的開頭和閉合標(biāo)簽會(huì)高亮!

示例:

8、sublimeLinter

作用:提供js和css的語法檢測(cè)!檢測(cè)的標(biāo)準(zhǔn)是可以根據(jù)用戶自定義的方式來執(zhí)行!

9、View in Browser

作用:在瀏覽器中可以像dreamweaver 那樣按下F12的時(shí)候在瀏覽器中瀏覽。

10、AutoFileName

作用:可以在你輸入引用文件路徑時(shí)給出提示,最典型的就是圖片的引用

示例:

px自動(dòng)換換rem

preferences====>package control? ? ==> install package



package setting ==>修改配置項(xiàng)? settings-user

{

? ? "fontsize": 80,//需要修改的配置項(xiàng)

? ? "precision": 8,

? ? "leadingzero": false,

? ? "exts": [".css", ".scss", ".less", ".sass", ".styl"]

}

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容