7 個不容錯過的 VS Code 擴展!
Visual Studio Code 是當前最受歡迎的源代碼編輯器之一。VSCode 的流行得益于豐富的擴展庫,使得第三方API的插入和使用變得更加容易。你甚至可以創建自己的 API 擴展,并發布到 Visual Studio 市場。
2021年,許多新出的 VS Code 擴展廣受開發人員的好評。在本文中,我們就來介紹一些我喜歡的擴展。希望這些擴展能夠幫助你提高生產力,并擴展開發人員的工作流程。
![7 個不容錯過的 VS Code 擴展!](http://haohuigou.com/wp-content/themes/module/themer/assets/images/lazy.png)
1.GitHub Copilot
首先來介紹一下 GitHub Copilot,這是一款由 GitHub 和 OpenAI 的 Codex 創建的AI 程序員工具,可以根據你提供的上下文自動生成代碼。
使用 VS Code 或 Jetbrains 的開發人員非常喜歡這款工具,因為它可以使用大多數編程語言生成整塊的代碼。想了解更多信息?你可以在 IDE 中與 Copilot 直接對話。
首先,你需要下載 GitHub Copilot VS Code 擴展(https://marketplace.visualstudio.com/items?itemName=GitHub.copilot),鏈接到 GitHub 賬號,并為該擴展授權(如果尚未注冊 Copilot,則需要加入候補名單)。
我使用 GitHub Copilot 測試了一些流行的 JavaScript 和 Swift 代碼片段,效果很好。你可以嘗試編寫一個函數,或只需寫一條注釋,Copilot就會提供相應的代碼。
![7 個不容錯過的 VS Code 擴展!](http://haohuigou.com/wp-content/themes/module/themer/assets/images/lazy.png)
你可以使用 Option + ] 和 Option + [ 切換建議的代碼,或者使用 Tab 接受完整的代碼。
Copilot帶來了無限的可能性。我嘗試了使用 Copilot 快速創建了一系列的函數:檢查回文字符串、驗證電子郵件、密碼以及利用URL 獲取 JSON 。
你還可以詢問“current price of Bitcoin and Ethereum”(比特幣和以太坊的當前價格),Copilot 就可以立即生成所需的函數。Copilot 最棒的地方在于,它幾乎超越了所有其他代碼片段的 VS 代碼擴展。
2.Thunder Client
API測試是開發人員日常工作的關鍵組成部分。如果想在將 API 端點集成到應用程序之前,測試和驗證 API 端點,則Postman 是一款很趁手的工具。
但是,在 ?VS Code 中測試 API 需要頻繁切換思路(因為你要切換到別的應用)。Thunder Client 為我們提供了一款輕量級、易用、整潔、簡單的 Rest API 客戶端擴展。
我們可以利用 Thunder Client 在編輯器內快速測試代碼庫的 API 端點,從而最大限度地減少頁面的切換。它可以替代 Postman,作為常用的無腳本測試工具。
![7 個不容錯過的 VS Code 擴展!](http://haohuigou.com/wp-content/themes/module/themer/assets/images/lazy.png)
3.Snipped
我們都喜歡在社交媒體上分享日常工作中的代碼片段。通常,我們需要將代碼片段復制粘貼到 carbon.now.sh 中,然后導出屏幕截圖。
Snipped可以直接在從 VS Code 編輯器自動為我們完成這項任務。讓我們告別在推特中復制粘貼代碼,將代碼截圖直接保存到剪貼板中。
![7 個不容錯過的 VS Code 擴展!](http://haohuigou.com/wp-content/themes/module/themer/assets/images/lazy.png)
4.Lorem.space
如果你想快速創建一個包含虛擬內容的 Web 應用程序原型,則Lorem.space 是理想的 VS Code 擴展。
Lorem.space是一個隨機圖像占位符生成器 API,提供不同的類別可供選擇。
你只需按下 CMD + Shift + P ,從下拉菜單中選擇 Lorem.space,選擇合適的類別(披薩、漢堡、人像或家具等),輸入所需的寬度和高度,lorem.space 就會自動生成圖像占位符的 URL。
![7 個不容錯過的 VS Code 擴展!](http://haohuigou.com/wp-content/themes/module/themer/assets/images/lazy.png)
5.面向 JavaScript 和 TypeScript 的 AI Doc Writer
軟件開發人員對編寫文檔往往有不同的看法。有些人很喜歡文檔,而有些人則認為編寫文檔是浪費時間。
Mintlify即將推出一款 VS Code 擴展 AI Doc Writer,這款工具的目標是利用工具編寫文檔。
只需選中代碼的某個函數并按 Command +,AI Doc Writer 就可以生成該函數的文檔。我測試了一個函數,效果還不錯。
![7 個不容錯過的 VS Code 擴展!](http://haohuigou.com/wp-content/themes/module/themer/assets/images/lazy.png)
如上所示,選不選函數中的空白,會生成截然不同的文檔。
需要源代碼的搜索引擎嗎?Mintlify Search Engine是同一團隊開發的另一款 VS Code 擴展。你可以用自然語言編寫搜索查詢來查找代碼片段。此外,你還可以詢問特定代碼的功能。現階段,該擴展還處于小范圍測試階段。
6.Blockman
你想高亮顯示代碼的作用域嗎?這樣就可以更輕松地閱讀當前代碼塊。有時在向同事解釋不同的控制流時,高亮顯示尤其有幫助。
不用擔心,VS Code 擴展 Blockman 正如其名所示:將代碼顯示成方塊。
Blockman允許你修改代碼塊的顯示顏色和深度、切換焦點,還有其他自定義。
在選中的框內高亮顯示嵌套的代碼塊非常容易。如下展示了利用這款工具顯示一層層的縮進:
![7 個不容錯過的 VS Code 擴展!](http://haohuigou.com/wp-content/themes/module/themer/assets/images/lazy.png)
7.Live Frame
![7 個不容錯過的 VS Code 擴展!](http://haohuigou.com/wp-content/themes/module/themer/assets/images/lazy.png)
LiveFrame 也是一款可以在編輯器內運行和預覽 Web 應用程序的 VS Code 擴展。可以幫助我們減少在 VS Code 和瀏覽器之間頻繁地切換。
除了提高生產力之外,Live Frame 擴展還可用于錄制或展示交互式演示教程。
參考鏈接:https://betterprogramming.pub/new-vs-code-extensions-released-2021-ee34a0b3a03f
文章轉載:CSDN
(版權歸原作者所有,侵刪)