推薦VScode十大實用插件
本文來源于:老袁聊前端
宇宙最好用的編譯器:Vscode,推薦以下十大使用插件!

1.代碼智能提示
Kite AI Code AutoComplete
Kite 支持js與python的多行補全功能,可幫助你在保持流程順暢的同時加快編碼速度。
推薦指數(shù):????? GitHub:https://github.com/kiteco/vscode-plugin VSCode地址:https://marketplace.visualstudio.com/items?itemName=TabNine.tabnine-vscode
Tabnine Autocomplete AI
Tabnine 是功能強大的人工智能助手,能幫你更快地敲代碼并減少錯誤。Tabnine 基于 AI 深度學習算法,能夠預測你編碼意圖并提供一鍵式代碼完成, 而且完全免費。
推薦指數(shù):????? github:https://github.com/codota/tabnine-vscode VSCode地址:https://marketplace.visualstudio.com/items?itemName=TabNine.tabnine-vscode 備注:低配電腦慎用
JavaScript (ES6) code snippets
支持JavaScript和TypeScript
推薦指數(shù):??? github:xabikos/vscode-javascript VSCode地址:https://marketplace.visualstudio.com/items?itemName=xabikos.JavaScriptSnippets 備注:常規(guī)ES代碼提示塊
2.主題+文件夾Icons
?依據(jù)個人喜好配置
?
Night Owl

給夜貓專用主題,而且針對喜歡深夜工作的碼農(nóng)進行了優(yōu)化,甚至顧及到了有色盲和夜盲的人。
推薦指數(shù):????? github:https://github.com/sdras/night-owl-vscode-theme VSCode地址:https://marketplace.visualstudio.com/items?itemName=sdras.night-owl
One Dark Pro

Atom 的標志性 One Dark 主題,也是VS Code中安裝次數(shù)最多的主題之一。
推薦指數(shù):???? github:https://github.com/Binaryify/OneDark-Pro VSCode地址:https://marketplace.visualstudio.com/items?itemName=zhuangtongfa.Material-theme
Material Theme

號稱最適配Visual Studio Code的史詩般的主題。
推薦指數(shù):??? github:https://github.com/material-theme/vsc-material-theme VSCode地址:https://marketplace.visualstudio.com/items?itemName=Equinusocio.vsc-material-theme
Ayu
一個色彩鮮艷的主題,提供三種版本:dark,light,mirage。

推薦指數(shù):???? github:https://github.com/ayu-theme/vscode-ayu VSCode地址:https://marketplace.visualstudio.com/items?itemName=teabyii.ayu
Material Theme Icons

推薦指數(shù):????? github:https://github.com/material-theme/vsc-material-theme-icons VSCode地址:https://marketplace.visualstudio.com/items?itemName=Equinusocio.vsc-material-theme-icons
Dracula Theme

推薦指數(shù):????? github:https://github.com/gerane/VSCodeThemes VSCode地址:https://marketplace.visualstudio.com/items?itemName=gerane.Theme-Dracula
3.大型項目新建文件
advanced-new-file
github:patbenatar/vscode-advanced-new-file VSCode地址:https://marketplace.visualstudio.com/items?itemName=patbenatar.advanced-new-file
4.分享代碼
carbon-now-sh
VSCode地址:https://marketplace.visualstudio.com/items?itemName=ericadamski.carbon-now-sh
5.運行調試代碼
Code Runner

github:https://github.com/formulahendry/vscode-code-runner VSCode地址:https://marketplace.visualstudio.com/items?itemName=formulahendry.code-runner
javascript console utils
幫你一鍵插入?console.log()?并自動填充內容。
github:https://github.com/whtouche/vscode-js-console-utils VSCode地址:https://marketplace.visualstudio.com/items?itemName=whtouche.vscode-js-console-utils
Live Server
啟動具有實時重新加載功能的本地開發(fā)服務器,可以處理靜態(tài)和動態(tài)頁面。

github:https://github.com/ritwickdey/vscode-live-server VSCode地址:https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer
6.字體選項
?依據(jù)個人喜好配置
?
Cascadia Code(配置fontLigatures)

微軟官方推薦,值得擁有~
推薦指數(shù):????? 下載地址:https://github.com/microsoft/cascadia-code/releases
Fira Code

推薦指數(shù):???? 下載地址:https://github.com/tonsky/FiraCode
Hack Nerd Font

推薦指數(shù):????? github: 下載地址:https://github.com/ryanoasis/nerd-fonts/tree/master/patched-fonts/Hack
Menlo
推薦指數(shù):???
Chalkboard
推薦指數(shù):???
Consolas
推薦指數(shù):???
Geeza pro
推薦指數(shù):???
Roboto Mono
推薦指數(shù):???
7.自定義VsCode
Fix VSCode Checksums
用于在更改VSCode核心文件后調整校驗和的擴展。一旦應用了校驗與更改并重新啟動VSCode,就能夠消除所有關于核心文件被修改的警告,例如標題欄中顯示[Unsupported]或啟動時出現(xiàn)以下對話框:

推薦指數(shù):????? github:https://github.com/lehni/vscode-fix-checksums VSCode地址:https://marketplace.visualstudio.com/items?itemName=lehni.vscode-fix-checksums
Custom CSS and JS Loader
推薦指數(shù):???? github:https://github.com/be5invis/vscode-custom-css VSCode地址:https://marketplace.visualstudio.com/items?itemName=be5invis.vscode-custom-css
background
給你的VSCode加個背景

推薦指數(shù):????? VSCode地址:https://marketplace.visualstudio.com/items?itemName=shalldie.background
SynthWave '84
據(jù)作者說他想穿越回1984年的夏天,因為他喜歡那個年代的霓虹燈。。。

推薦指數(shù):????? github:https://github.com/robb0wen/synthwave-vscode VSCode地址:https://marketplace.visualstudio.com/items?itemName=RobbOwen.synthwave-vscode
Vibrancy
半透明效果

推薦指數(shù):????? github:https://github.com/EYHN/vscode-vibrancy VSCode地址:https://marketplace.visualstudio.com/items?itemName=eyhn.vscode-vibrancy
8.提升你的正則技能

RegExp Preview and Editor
https://marketplace.visualstudio.com/items?itemName=Lulus.vscode-regexp-preivew
Regex Previewer
https://marketplace.visualstudio.com/items?itemName=le0zh.vscode-regexp-preivew
9.美化JavaScript代碼
Prettier - Code formatter

推薦指數(shù):??? github:https://github.com/prettier/prettier-vscode VSCode地址:https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
ESLint

地球人都知道,不多說了
推薦指數(shù):?????
highlight-icemode

推薦指數(shù):??? github:https://github.com/EsIce/highlight-icemode VSCode地址:https://marketplace.visualstudio.com/items?itemName=iceliu.highlight-icemode
Bracket Pair Colorizer 2

推薦指數(shù):??? github:https://github.com/CoenraadS/Bracket-Pair-Colorizer-2 VSCode地址:https://marketplace.visualstudio.com/items?itemName=CoenraadS.bracket-pair-colorizer-2
10.Package.json 及時查看包版本號
Version Lens

VSCode地址:https://marketplace.visualstudio.com/items?itemName=pflannery.vscode-versionlens
