全文共1689字，預計學習時長5分鐘

圖源：Unsplash

在2017年，VSCode有260萬月活躍用戶(這是我找到的最新官方數據，現在肯定更多)，可以說是目前最好的代碼編輯器。

它最大的一個特點是，插件多可自定義。

MarketPlace(插件商店)提供了大量擴展插件，開發人員完全可以根據需求進行自定義設置，這也有助于編寫高質量的代碼。

本文將為編寫HTML，CSS，JavaScript以及使用VueJS或ReactJS等框架的前端工程師推薦10個VS Code擴展插件。

1. CSS Peek

CSSPeak通過識別和枚舉已應用的不同樣式以幫助開發者處理標記語言的類字符串和ID。這很方便，因為開發者不再需要在HTML和CSS文件之間頻繁跳轉。

2. ESLint

我難以評價該插件，因為它有很多追隨者，但也有很多開發者不喜歡它。而毋庸置疑的是，該插件有助于編寫簡潔代碼，如果你是JavaScript開發者，那這個下載量達2400萬次的擴展插件是最好的選擇。

3. NPM

所有開發者應該都認識NPM，其全稱是Node Package Manager(node包管理器)。該擴展插件有助于管理Package.json，當生產環境依賴包未安裝時會發出警告，并確保安裝的版本正確。

4. Live Sass Compiler

LiveSass Compiler雖然很小，但功能極其強大，它可以將SASS /SCSS文件實時編譯為CSS文件，并在瀏覽器中展示已編譯樣式的實時預覽。

5. Debugger for Chrome

對許多開發者而言，Chrome是開發、測試和調試代碼的首選瀏覽器。通過這個VS Code的官方擴展插件，開發者可以直接在VS Code中進行以上操作——沒什么能比這更棒了！

6. JavaScript Code Snippets

此擴展插件的創建者是Charalampos Karypidis，下載量達450萬次。它提供用于編寫JavaScript，Typescript，React，Vue，HHTML等的代碼片段，以及ES6語法支持。

7. Prettier

該插件十分簡潔，編寫者為Esben Petersen，下載量近1400萬次。它幫助開發者格式化代碼，并提供顏色關鍵字以使代碼更具可讀性。

8. Beautify

它同Prettier十分類似，是一種出色的代碼格式化擴展插件，近1200萬的下載量足以說明一切。可以用它格式化以JavaScript，JSON，CSS，Sass和HTML編寫的代碼。

9. Vetur

Vetur是官方的VueJS擴展插件，下載量逾2000萬次。其功能包括：錯誤檢查、自動補全及提供Vue代碼片段。如果你也是一名Vue開發者，就能切身體會到這個插件的優秀之處！

10. Live Server

LiveServer和LiveSass Compiler的創建者是同一個人——RitwickDey。在VS Code中，LiveServer能開啟一個本地開發服務器，為靜態網頁和動態網頁提供服務。使用編輯器中的go-live按鈕，開發者可以立即把代碼放到服務器上，該擴展插件還支持實時刷新頁面——真是太棒了！

結論

本文推薦的擴展插件并不完整，也不一定是最好的，但我希望它能為開發者提供一些好的工具來編寫高質量的代碼，讓網頁開發者如虎添翼。

如果大家發現了一些有用的工具，或其他你認為是頂級的擴展插件，記得在評論區里和大家一起分享哦。

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的chrome插件 vscode_2020年，前端开发者必备的10个VS Code扩展插件的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。