国产精品乱码一区二区三区,国产色区

有句話，事半功倍，其必然是借助了某些思想和工具。

VSCode是我們前端開發(fā)的武器，本文40+精選插件，讓其更加鋒利，無堅(jiān)不摧??！

必備的

下面這些必備的我就不說了

代碼段

JavaScript \(ES6\) code snippets^[1]， ES7 React/Redux/GraphQL/React-Native snippets^[2]
vue^[3], vetur^[4], Vue 3 Snippets^[5]， Vue VSCode Snippets^[6]

代碼段這玩意，你也可自定義，可以參見 VSCode創(chuàng)建自定義代碼段^[7]

代碼檢查和格式化

ESLint^[8], Prettier - Code formatter^[9], Beautify^[10]

其他

open in browser^[11]

由于VSCode自身功能的增強(qiáng)，NPM-Scripts^[12], Change Case^[13]等的插件就不需要特意安裝了。

接下來更精彩?。?！， 全程高能動(dòng)圖，請(qǐng)別分神！

實(shí)用高效工具

scode-js-debug^[14] debug利器

新版VSCode內(nèi)置。

可用于調(diào)試Node.js、 Chrome、 Edge、 WebView2、 VS Code 擴(kuò)展等等，替換 Debugger for Chrome 插件。其還可以調(diào)試Service Worker, Web Worker, 功能是異常的強(qiáng)大。

如下的演示，你首先的配置好launch.json

Live Server^[15] 靜態(tài)服務(wù)器

為靜態(tài)和動(dòng)態(tài)頁面啟動(dòng)具有實(shí)時(shí)重載特性的本地開發(fā)服務(wù)器。

這也是我平時(shí)最喜歡用的插件之一，右鍵一鍵啟動(dòng)，還支持熱等，爽字了得。

vscode-live-server-explorer-menu-demo-1.gif

Code Runner^[16] 代碼運(yùn)行器

最喜歡的插件，沒有之三，平時(shí)寫一些測(cè)試代碼，和一些邏輯庫，快捷鍵 Ctrl+Alt+M, 喝口水，看一下結(jié)果，悠哉。

一鍵運(yùn)行多種語言運(yùn)行代碼片段或代碼文件: c，c + + ，Java，JavaScript，PHP，Python，Perl，Perl 6，Ruby，Go，Lua，Groovy，PowerShell，BAT/CMD，BASH/SH，f # Script，f # (。NET 核心) ，c # 腳本，多到你想不到。

Markdown Preview Enhanced^[17] markdown編輯和預(yù)覽

typora？其實(shí)不需要的，這款markdown插件，讓你一邊編輯markdonwn一邊預(yù)覽，編程體驗(yàn)不差于掘金那款。

如果需要更多功能比如 TODO, 或者多行同時(shí)修改等, Markdown All in One^[18] 是不錯(cuò)的選擇。

下面演示一下常用的TODO便簽。

Git History^[19] 和 GitLens^[20] Git歷史記錄

誰動(dòng)了我的代碼？ 直接在VSCode里面，查看Git的歷史，搜索，版本對(duì)比。清爽?。?/p>

VSCode也內(nèi)置了時(shí)間線的功能，但是能力還是弱一些。

GitLens功能更加強(qiáng)大，無縫導(dǎo)航和瀏覽 Git 存儲(chǔ)庫。

revision-navigation.gif

Image Preview^[21] 圖片預(yù)覽

CSS編寫，再也擔(dān)心寫錯(cuò)圖片地址啦！
其支持在html和css文件里面，當(dāng)有使用圖片路徑的時(shí)候，在左邊實(shí)現(xiàn)小的預(yù)覽器，一眼就知對(duì)與錯(cuò)。

JSON to TS^[22] json轉(zhuǎn)為TS申明

現(xiàn)在的前端，誰還不寫個(gè)TypeScript，可是咋生成申明文件呢？手寫，那你太out了。這款插件，一鍵生成。

別人手巧，我在喝茶，笑一個(gè)。

vscode-fileheader^[23] 和 koroFileHeader^[24] 生成文件備注

某人某天編寫，某人某天更新，來過就留下足跡，一眼望穿！

如果你覺得這些信息還不夠，koroFileHeader^[25] 提供更督導(dǎo)的注釋，也同時(shí)支持生成函數(shù)注釋。

npm Intellisense^[26] npm模塊導(dǎo)入智能提示

那么多npm模塊，記性不好，腦子不快，沒關(guān)系，這款插件替你分憂。

Import Cost^[27] 依賴包大小提示

我們一來那么多包，你引入的成本是多少呢？成本早知道，就交給她吧！

formate: CSS/LESS/SCSS formatter^[28] css樣式美化

VSCode內(nèi)置css格式化功能，這款支持less, scss，高效美觀，如你！

TODO Highlight^[29] 高亮TODO

在代碼中突出顯示 TODO、 FIXME 和其他注釋。

有時(shí)候，在將代碼發(fā)布到生產(chǎn)環(huán)境之前，您會(huì)忘記檢查在編碼時(shí)添加的 todo。

Add jsdoc comments^[30] 給方法添加JSDoc

自動(dòng)給方法添加JSDoc, 可別說我不會(huì)寫注釋, 我對(duì)我寫的每一行代碼負(fù)責(zé)?。?！

DotENV^[31] env文件高亮

這年頭，誰的配置還沒不用個(gè)env文件，沒高亮，真難看，這款就是你的救星。

HTML Snippets^[32] html代碼段

此插件能快速的輸出html代碼，效率就是懶出來的，你們說對(duì)吧。

Wrap Console Log Lite^[33] 快捷的輸出變量

我們經(jīng)常使用console.log輸出變量來查看執(zhí)行情況，這插件，直接給你生成出書代碼，懶的可以啊，懶到極致。

Quokka.js^[34] 直接顯示變量結(jié)果

不用運(yùn)行，就能知道你的代碼結(jié)果，這編程體驗(yàn)也是沒誰了，把更多時(shí)間話費(fèi)在邏輯上吧。

REST Client^[35] rest請(qǐng)求

想請(qǐng)求某個(gè)站點(diǎn)的接口，axios?, express? , No No No , 打開VS code直接發(fā)請(qǐng)求就好。

此插件允許您直接發(fā)送 HTTP 請(qǐng)求并查看 visualstudio 代碼中的響應(yīng)。

rest-usage (1).gif

Path Intellisense^[36] 引用路徑智能提示

vscode-faker^[37] 生成虛假數(shù)據(jù)

誰還沒造點(diǎn)假數(shù)據(jù)，就這么簡(jiǎn)單！

Regex Previewer^[38] 邊寫正則邊看結(jié)果

一邊寫正則，一邊就能看到結(jié)果，這調(diào)試真的太方便了?。?！

SVG Viewer^[39] SVG文件預(yù)覽

預(yù)覽svg文件，還能到處成為圖片，利器！

Auto Close Tag^[40] 自動(dòng)關(guān)閉標(biāo)簽

自動(dòng)添加 HTML/XML 關(guān)閉標(biāo)記，與 Visual Studio IDE 或 Sublime Text 相同。

Auto Rename Tag^[41] 標(biāo)簽重命名

自動(dòng)重命名成對(duì)的 HTML/XML 標(biāo)記，與 Visual Studio IDE 相同。

我們總有時(shí)候會(huì)寫錯(cuò)，那么這就可以降低你犯錯(cuò)后修復(fù)成本。

CSS Peek^[42] css定位器

我的class在哪定義的，自己都找不到了，怎么辦，有請(qǐng)這位！！

Code Spell Checker^[43] 拼寫檢查

媽媽再也不擔(dān)心我寫錯(cuò)單詞了。其能檢查拼寫錯(cuò)誤，并給于提示，非常好的伙伴！

Color Picker^[44] 顏色選擇器

那種顏色好看呢，別著急，調(diào)出色板，慢慢選擇吧。

Sort Typescript imports^[45] import自動(dòng)排序

導(dǎo)入太多的庫了，眼花撩順，這款插件讓他們有序排列，強(qiáng)迫癥患者的福星。我記得eslint好像也有類似的規(guī)則。

Bracket Pair Colorizer 2^[46] 括號(hào)對(duì)齊利器

代碼寫太多，大括號(hào)太多，都不知道誰是誰的誰呢，這款插件給你明示。

vscode-icon^[47] 文件圖標(biāo)

讓 vscode 資源樹目錄加上圖標(biāo)，賞心悅目！

icons.gif

npm^[48] npm擴(kuò)展

這個(gè)擴(kuò)展支持運(yùn)行 package.json 文件中定義的 npm 腳本，并根據(jù) package.json 中定義的依賴項(xiàng)驗(yàn)證已安裝的模塊。 是不是很酷！

Project Manager^[49] 項(xiàng)目管理利器

它可以幫助你輕松地訪問你的項(xiàng)目，不管它們位于哪里。不要再錯(cuò)過那些重要的項(xiàng)目了。

project-manager-side-bar-tags (1).gif

Live Sass Compiler^[50] SASS實(shí)時(shí)編譯

一個(gè) VSCode 擴(kuò)展，它可以幫助您實(shí)時(shí)地將 SASS/SCSS 文件編譯/傳輸?shù)?CSS 文件中，并實(shí)時(shí)重新加載瀏覽器。

SASSAnimatedPreview.gif

Todo Tree^[51] TODO展示

把你的TODO事項(xiàng)以樹形結(jié)構(gòu)列出來，再也不擔(dān)心忘記點(diǎn)啥呢

Markdown PDF^[52] markdown轉(zhuǎn)PDF

markdown寫完文章，順便生成pdf, 真的是6啊

寫在最后

如果你覺得不錯(cuò)，你的一贊一評(píng)就是我前行的最大動(dòng)力。

技術(shù)交流群請(qǐng)到這里來^[53]?；蛘咛砑游业奈⑿?dirge-cloud，一起學(xué)習(xí)。

引用

精選！15 個(gè)必備的 VSCode 插件（前端類）^[54]
VSCode拓展推薦（前端開發(fā)）^[55]
VSCode前端必備插件，有可能你裝了卻不知道如何使用？^[56]
marketplace.visualstudio^[57]

參考資料

[1]

https://marketplace.visualstudio.com/items?itemName=xabikos.JavaScriptSnippets: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dxabikos.JavaScriptSnippets

[2]

https://marketplace.visualstudio.com/items?itemName=dsznajder.es7-react-js-snippets: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Ddsznajder.es7-react-js-snippets

[3]

https://marketplace.visualstudio.com/items?itemName=jcbuisson.vue: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Djcbuisson.vue

[4]

https://marketplace.visualstudio.com/items?itemName=octref.vetur: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Doctref.vetur

[5]

https://marketplace.visualstudio.com/items?itemName=hollowtree.vue-snippets: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dhollowtree.vue-snippets

[6]

https://marketplace.visualstudio.com/items?itemName=sdras.vue-vscode-snippets: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dsdras.vue-vscode-snippets

[7]

https://www.cnblogs.com/dotnetcrazy/p/9950431.html: https://link.juejin.cn?target=https%3A%2F%2Fwww.cnblogs.com%2Fdotnetcrazy%2Fp%2F9950431.html

[8]

https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Ddbaeumer.vscode-eslint

[9]

https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Desbenp.prettier-vscode

[10]

https://marketplace.visualstudio.com/items?itemName=HookyQR.beautify: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3DHookyQR.beautify

[11]

https://marketplace.visualstudio.com/items?itemName=techer.open-in-browser: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dtecher.open-in-browser

[12]

https://marketplace.visualstudio.com/items?itemName=traBpUkciP.vscode-npm-scripts: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3DtraBpUkciP.vscode-npm-scripts

[13]

https://marketplace.visualstudio.com/items?itemName=wmaurer.change-case: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dwmaurer.change-case

[14]

https://marketplace.visualstudio.com/items?itemName=ms-vscode.js-debug: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dms-vscode.js-debug

[15]

https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dritwickdey.LiveServer

[16]

https://marketplace.visualstudio.com/items?itemName=formulahendry.code-runner: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dformulahendry.code-runner

[17]

https://marketplace.visualstudio.com/items?itemName=shd101wyy.markdown-preview-enhanced: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dshd101wyy.markdown-preview-enhanced

[18]

https://marketplace.visualstudio.com/items?itemName=yzhang.markdown-all-in-one: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dyzhang.markdown-all-in-one

[19]

https://marketplace.visualstudio.com/items?itemName=donjayamanne.githistory: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Ddonjayamanne.githistory

[20]

https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Deamodio.gitlens

[21]

https://marketplace.visualstudio.com/items?itemName=kisstkondoros.vscode-gutter-preview: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dkisstkondoros.vscode-gutter-preview

[22]

https://marketplace.visualstudio.com/items?itemName=MariusAlchimavicius.json-to-ts: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3DMariusAlchimavicius.json-to-ts

[23]

https://marketplace.visualstudio.com/items?itemName=mikey.vscode-fileheader: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dmikey.vscode-fileheader

[24]

https://marketplace.visualstudio.com/items?itemName=OBKoro1.korofileheader: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3DOBKoro1.korofileheader

[25]

https://marketplace.visualstudio.com/items?itemName=OBKoro1.korofileheader: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3DOBKoro1.korofileheader

[26]

https://marketplace.visualstudio.com/items?itemName=christian-kohler.npm-intellisense: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dchristian-kohler.npm-intellisense

[27]

https://marketplace.visualstudio.com/items?itemName=wix.vscode-import-cost: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dwix.vscode-import-cost

[28]

https://marketplace.visualstudio.com/items?itemName=MikeBovenlander.formate: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3DMikeBovenlander.formate

[29]

https://marketplace.visualstudio.com/items?itemName=wayou.vscode-todo-highlight: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dwayou.vscode-todo-highlight

[30]

https://marketplace.visualstudio.com/items?itemName=stevencl.addDocComments: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dstevencl.addDocComments

[31]

https://marketplace.visualstudio.com/items?itemName=mikestead.dotenv: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dmikestead.dotenv

[32]

https://marketplace.visualstudio.com/items?itemName=abusaidm.html-snippets: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dabusaidm.html-snippets

[33]

https://marketplace.visualstudio.com/items?itemName=ergenekonyigit.vscode-wrap-console-log-lite: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dergenekonyigit.vscode-wrap-console-log-lite

[34]

https://marketplace.visualstudio.com/items?itemName=WallabyJs.quokka-vscode: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3DWallabyJs.quokka-vscode

[35]

https://marketplace.visualstudio.com/items?itemName=humao.rest-client: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dhumao.rest-client

[36]

https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dchristian-kohler.path-intellisense

[37]

https://marketplace.visualstudio.com/items?itemName=deerawan.vscode-faker: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Ddeerawan.vscode-faker

[38]

https://marketplace.visualstudio.com/items?itemName=chrmarti.regex: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dchrmarti.regex

[39]

https://marketplace.visualstudio.com/items?itemName=cssho.vscode-svgviewer: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dcssho.vscode-svgviewer

[40]

https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-close-tag: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dformulahendry.auto-close-tag

[41]

https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dformulahendry.auto-rename-tag

[42]

https://marketplace.visualstudio.com/items?itemName=pranaygp.vscode-css-peek: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dpranaygp.vscode-css-peek

[43]

https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dstreetsidesoftware.code-spell-checker

[44]

https://marketplace.visualstudio.com/items?itemName=anseki.vscode-color: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Danseki.vscode-color

[45]

https://marketplace.visualstudio.com/items?itemName=miclo.sort-typescript-imports: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dmiclo.sort-typescript-imports

[46]

https://marketplace.visualstudio.com/items?itemName=CoenraadS.bracket-pair-colorizer-2: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3DCoenraadS.bracket-pair-colorizer-2

[47]

https://marketplace.visualstudio.com/items?itemName=vscode-icons-team.vscode-icons: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dvscode-icons-team.vscode-icons

[48]

https://marketplace.visualstudio.com/items?itemName=eg2.vscode-npm-script: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Deg2.vscode-npm-script

[49]

https://marketplace.visualstudio.com/items?itemName=alefragnani.project-manager: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dalefragnani.project-manager

[50]

https://marketplace.visualstudio.com/items?itemName=ritwickdey.live-sass: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dritwickdey.live-sass

[51]

https://marketplace.visualstudio.com/items?itemName=Gruntfuggly.todo-tree: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3DGruntfuggly.todo-tree

[52]

https://marketplace.visualstudio.com/items?itemName=yzane.markdown-pdf: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2Fitems%3FitemName%3Dyzane.markdown-pdf

[53]

https://juejin.cn/pin/6994350401550024741: https://juejin.cn/pin/6994350401550024741

[54]

https://zhuanlan.zhihu.com/p/27905838: https://link.juejin.cn?target=https%3A%2F%2Fzhuanlan.zhihu.com%2Fp%2F27905838

[55]

https://github.com/varHarrie/varharrie.github.io/issues/10: https://link.juejin.cn?target=https%3A%2F%2Fgithub.com%2FvarHarrie%2Fvarharrie.github.io%2Fissues%2F10

[56]

https://juejin.cn/post/6844903982033272845: https://juejin.cn/post/6844903982033272845

[57]

https://marketplace.visualstudio.com/: https://link.juejin.cn?target=https%3A%2F%2Fmarketplace.visualstudio.com%2F

作者：云的世界

本站僅提供存儲(chǔ)服務(wù)，所有內(nèi)容均由用戶發(fā)布，如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容，請(qǐng)點(diǎn)擊舉報(bào)。

九色国产,午夜在线视频,新黄色网址,九九色综合,天天做夜夜做久久做狠狠,天天躁夜夜躁狠狠躁2021a,久久不卡一区二区三区

必備的

實(shí)用高效工具

scode-js-debug[14] debug利器

Live Server[15] 靜態(tài)服務(wù)器

Code Runner[16] 代碼運(yùn)行器

Markdown Preview Enhanced[17] markdown編輯和預(yù)覽

Git History[19] 和 GitLens[20] Git歷史記錄

Image Preview[21] 圖片預(yù)覽

JSON to TS[22] json轉(zhuǎn)為TS申明

vscode-fileheader[23] 和 koroFileHeader[24] 生成文件備注

npm Intellisense[26] npm模塊導(dǎo)入智能提示

Import Cost[27] 依賴包大小提示

formate: CSS/LESS/SCSS formatter[28] css樣式美化

TODO Highlight[29] 高亮TODO

Add jsdoc comments[30] 給方法添加JSDoc

DotENV[31] env文件高亮

HTML Snippets[32] html代碼段

Wrap Console Log Lite[33] 快捷的輸出變量

Quokka.js[34] 直接顯示變量結(jié)果

REST Client[35] rest請(qǐng)求

Path Intellisense[36] 引用路徑智能提示

vscode-faker[37] 生成虛假數(shù)據(jù)

Regex Previewer[38] 邊寫正則邊看結(jié)果

SVG Viewer[39] SVG文件預(yù)覽

Auto Close Tag[40] 自動(dòng)關(guān)閉標(biāo)簽

Auto Rename Tag[41] 標(biāo)簽重命名

CSS Peek[42] css定位器

Code Spell Checker[43] 拼寫檢查

Color Picker[44] 顏色選擇器

Sort Typescript imports[45] import自動(dòng)排序

Bracket Pair Colorizer 2[46] 括號(hào)對(duì)齊利器

vscode-icon[47] 文件圖標(biāo)

npm[48] npm擴(kuò)展

Project Manager[49] 項(xiàng)目管理利器

Live Sass Compiler[50] SASS實(shí)時(shí)編譯

Todo Tree[51] TODO展示

Markdown PDF[52] markdown轉(zhuǎn)PDF