01-vscode主題及插件

一、主題

1、Atom One Light Theme

image.png

2、Dracula Official

Dracula Official 是受到很高評(píng)價(jià)的一款主題,配色方案可以讓人感到平靜,暗淡的紫色會(huì)讓你覺(jué)得它有一種特殊的魅力。插件帶有文件圖標(biāo)設(shè)計(jì)。界面效果如下:

3、Brackets Light Pro

本人目前用的

image.png

二、通用插件

1、HTML Snippets

超級(jí)實(shí)用且初級(jí)的 H5代碼片段以及提示


image.png

2、HTML CSS Support

讓 html 標(biāo)簽上寫(xiě)class 智能提示當(dāng)前項(xiàng)目所支持的樣式
新版已經(jīng)支持scss文件檢索


image.png

3、vscode-icon

讓 vscode 資源樹(shù)目錄加上圖標(biāo),必備良品!


image.png

4、Path Intellisense

自動(dòng)路勁補(bǔ)全,默認(rèn)不帶這個(gè)功能的,趕緊裝


image

5、Npm Intellisense

require 時(shí)的包提示(最新版的vscode已經(jīng)集成此功能)


image

6、Document this

js 的注釋模板 (注意:新版的vscode已經(jīng)原生支持,在function上輸入/** tab)


image

7、Project Manager

在多個(gè)項(xiàng)目之前快速切換的工具

8、beautify

格式化代碼的工具

9、fileheader

頂部注釋模板,可定義作者、時(shí)間等信息,并會(huì)自動(dòng)更新最后修改時(shí)間


image

10、filesize

在底部狀態(tài)欄顯示當(dāng)前文件大小,點(diǎn)擊后還可以看到詳細(xì)創(chuàng)建、修改時(shí)間


image.png

11、Bracket Pair Colorizer

讓括號(hào)擁有獨(dú)立的顏色,易于區(qū)分。可以配合任意主題使用。


image.png

12、cssrem

將css中的px自動(dòng)轉(zhuǎn)換為rem.再也不用計(jì)算器了(大漠大神推介)

13、Sublime Text Keymap

啟動(dòng)sublimeText的快捷鍵配置。vscode上面自有一套快捷鍵設(shè)定,個(gè)人習(xí)慣sublime快捷鍵

14、Import Cost

引入包大小計(jì)算,對(duì)于項(xiàng)目打包后體積掌握很有幫助


image.png

15、markdownlint

書(shū)寫(xiě)md文件的預(yù)覽插件

16、language-stylus

CSS預(yù)處理器styl后綴文件的識(shí)別擴(kuò)展

17、View In Browser

迅速通過(guò)瀏覽器打開(kāi)html文件

三、框架和庫(kù)的插件

1、jQuery Code Snippets

jquery 重度患者必須品,廢話不多說(shuō),上圖


image.png

2、Bootstrap 3 Sinnpet

常用 bootstrap 的可以下

3、vetur

語(yǔ)法高亮、智能感知、Emmet等


image.png

4、VueHelper

snippet代碼片段


image

5、Vue 2 Snippets

快速新建vue頁(yè)面

?著作權(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)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

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

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