【分享】每個 Web 開發者在 2021 年必須擁有 15 個 VSCode 擴展


為什么VSCode如此受歡迎

Visual Studio Code在開發人員中迅速流行起來,它是最流行的開發環境,可定制性是其流行的原因之一。

因此,如果你正在使用VSCode,這里有一個擴展列表,你必須提高你的工作效率。

1. Git Lens

當你與你的團隊成員在一個項目上工作時,這個擴展使用VSCode的強大功能,幫助你可視化代碼創作一目了然。

它顯示了特定代碼何時提交或更改,以及是誰更改了它。

有時,你的團隊成員提交的代碼可能會破壞項目的其他功能,這在那段時間是有幫助的。你可以在這里找到它。

2. Wallaby.js

js是一個智能的JavaScript測試運行器,它可以持續運行你的測試。

當您更改代碼時(甚至不保存文件),它將直接向代碼編輯器報告代碼覆蓋率和其他結果。

這個擴展有助於提高您的開發效率。

3. TypeScript Hero

TypeScript是JavaScript的一個超集,具有可選的類型,並可編譯為純JavaScript。

當我們使用TypeScript時,這個擴展就派上用場了。它通過一個名為“燈泡”的功能對你的導入文件進行分類和組織,並修復編碼錯誤。

4. Prettier Code Formatter

Prettier是一種固執的代碼格式,它使開發人員在代碼格式方面的工作變得更容易。

您可以將其配置為保存時格式化,並在保存時格式化代碼。

一旦你有了這個擴展,你將永遠不必擔心格式化的代碼。

5. Path Intellisense

如果你在React或Angular等JavaScript庫上工作,而且你在做大型項目,你就知道在導入時找到組件的確切路徑有多煩人。

這個擴展可以幫助你自動完成導入的路徑。

它還可以幫助您自動完成HTML文件中的文件引用。

6. Debugger for Chrome

我們都知道有時候調試是多么煩人,所以這個擴展被用來幫助你調試JavaScript代碼。

它是由微軟開發的。我們可以設置斷點、逐步執行代碼、動態添加調試腳本等等。

假設我們有一個不確定是否正在執行的函數,這個擴展可以通過在執行時在調試器中暫停來幫助我們。

7. Bracket Pair Colorizer

這個擴展允許匹配的括號被識別的顏色。

當你在調試過程中處理一個巨大的代碼庫時,這個擴展就像救星一樣。

用戶可以定義要匹配的字符和要使用的顏色。

8. JavaScript (ES6) Code Snippets

如果您是一名JavaScript開發人員,這可以為您節省大量時間。

當你想快速構建新項目時,這可能會有幫助。

它沒有鍵入全部代碼,而是為最常見的JavaScript函數預定義了許多代碼片段。

它支持TypeScript、React、Vue和HTML。

如果你在React上工作,有一個類似的擴展。(ES7 React/Redux/GraphQL/React-Native snippets)。

9. Live Share

當您與您的團隊成員一起解決問題,並希望在編輯器上共同處理相同的代碼時,這將幫助您將代碼編輯器的控制權交給您的團隊成員,您可以同時處理它。

您還可以共享終端實例、本地主機web應用程序、語音通話等。

10. ESLint

由於JavaScript是一種高度靈活的語言,一些小錯誤可能會導致巨大的問題。

因此,當工作在巨大的代碼庫,我們需要一個linter和一個格式化程序。

這個擴展可以幫助你做到這一點。

這可以自動格式化你的代碼,並發現你的代碼中的錯誤。

實現ESLint規則會讓你離為你的代碼庫建立良好的標准更近一步。

11. Paste JSON as Code

作為一名開發人員,您經常要處理api。

眾所周知,api中最常用的數據結構是JSON。

為了避免一些可能破壞應用程序的類型錯誤,我們使用類或接口。

這個擴展可以用JSON數據生成一個類。

因此,與其手工編寫類,我們可以使用它來節省創建類的時間和負擔。

這個擴展支持大多數流行的語言。

12. Peacock

當你在多個工作空間上工作時,這個擴展可以幫助你識別你已經切換到或工作的確切的工作空間。

13. Better Comments

這個擴展可以幫助您在代碼中創建更人性化的注釋。

它允許您為不同類型的注釋提供不同的顏色代碼,這些注釋可以是TODOs、高亮顯示、警報和其他類型的注釋。

這是強烈推薦的,用於編寫干凈和文檔化的代碼。

14. Search node_modules

當我們構建組件庫並在不同的應用程序中使用該組件時,我們肯定會對節點模塊進行一些修改。

這個擴展允許你在項目的node_modules目錄中快速瀏覽文件。

15. Rest Client

作為開發人員,我們每天都會定期使用Postman來檢查API的響應。

這個擴展允許你做一個HTTP請求,並在VSCode中直接查看響應,而不是在兩個應用程序之間切換,這個擴展為你做這個工作。

其他精彩文章


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM