直接拿來用！VS Code 最強插件指南

作為一款優秀的代碼編輯器，Visual Studio Code 中最常用的插件有哪些？

作者 | Adrian Hajdin，JavaScript 開發者

譯者 | 虎說

責編 | 屠敏

出品 |CSDN（ID：CSDNNews）

以下為譯文：

這是一篇關於我個人認為是很好的 Visual Studio Code 插件的簡短文章。文中所有出現的插件都是我的最愛，如果你也有使用其他插件但我沒有提及到的，歡迎在評論區推薦出來。

Code Time

Code Time（https://marketplace.visualstudio.com/items?itemName=softwaredotcom.swdc-vscode）是一個開源插件，它可以在代碼編輯器中提供編程度量。安裝擴展插件程序後，系統將提示你登錄其登陸界面。在代碼編輯器內部，你可以按下 command + shift + P。這時將顯示一個可以鍵入的窗口 Code Time，然後你可以選擇在代碼編輯器內或瀏覽器中顯示數據。

在瀏覽器上，所有信息都將如下所示：

在瀏覽器內部，情況會更加豐富多彩：

如果你想知道或者你需要知道實際花費了多少時間編碼，這個插件就會顯得非常有用。

One Dark Pro

One Dark Pro 是 Atom最受歡迎的主題，它是有史以來 Visual Studio Code 下載次數最多的主題之一。

正如你在此示例中所看到的，我們為客戶端和伺服器等目錄以及 .eslintrc .gitignore 和 package.json 等文件提供了圖標。

One Dark Pro 一直使用 React、Angular、Redux 和許多不同的框架和庫，為組件，工具，樣式以及 reducer，actions 和 store 提供不同的目錄圖標。

Bracket Pair Colorize

此擴展插件允許使用顏色標識匹配的括號。當你擁有深層嵌套的對象或函數時，這個插件就會變的非常有用，如下所示：

Color Highlight

“顏色突出顯示”顯示任何顏色代碼的直觀表示。例如，如果你鍵入 RGB，RGBa，十六進製或任何其他顏色代碼，你將能夠在視覺上看到顏色，如下例所示：

顏色突出顯示

Path Intellisense

Path Intellisense 是一個 Visual Studio Code 插件，可自動補全文件名。它對於在 React 中導入組件非常有用，因為你不必手動輸入要查找的文件的路徑。

ES7 React/Redux/GraphQL/React-Native片段

列表中的下一個擴展名是 ES7 React/Redux/GraphQL/React-Native 代碼段。相當長的名字，但相信我，它會節省你很多時間，特別是如果你在 React 使用它的時候。此擴展程序為你提供了 ES7 中的 JavaScript 和 React/Redux 代碼段以及 VS 代碼的 Babel 插件功能。

在你的代碼編輯器裡面你可以按 command + shift + P，然後 ES7 Snippet Search 你會看到一長串的短命令，你可以運行這些命令以獲得更長的代碼片段。

你也可以在上面執行搜索，以便你可以輕鬆找到功能組件片段的命令。只需在編輯器中鍵入命令並按Enter即可運行命令。就這麽簡單，就像魔術一樣。

GitLens?—?Git supercharged

GitLens 增強了 Visual Studio Code 中內置的 Git 功能。

它可以幫助你通過 git-blame 注釋和代碼注釋一目了然地查看代碼作者身份，無縫導航和探索 Git 存儲庫，通過強大的比較命令獲得有價值的見解等等。

你只需要單擊代碼行，就可以看到編輯它的人、編輯它的時間以及提交的內容。

如果你還有其他的好的插件歡迎評論推薦！

本文為 CSDN 翻譯，如需轉載，請注明來源出處。

【END】

熱 文推 薦

喜歡就一起“在看”吧！