1. 程式人生 > 實用技巧 >裝上後這 10個擴充套件後,VSCode 猛虎添翼,無敵了

裝上後這 10個擴充套件後,VSCode 猛虎添翼,無敵了

VS Code是目前最受歡迎的程式碼編輯器之一,也是大多數Web開發人員的首選武器。沒錯,它快速,高效並且具有強大的功能,使其成為用於開發幾乎所有東西的非常強大的工具。

以下是一些我最喜歡的擴充套件,以下排名不分先後。

HTML CSS Support


此副檔名使您可以在HTML文件中新增對CSS檔案的支援。因此,您將獲得類屬性和名稱完成,id屬性完成和遠端CSS檔案等功能。因此,您可以將引導CDN新增為遠端CSS,以在程式碼中獲取類名稱完成!酷吧?

將Bootstrap CDN新增為遠端:

"css.remoteStyleSheets": [ "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"],
  • 1

運作方式如下:

從市場下載:HTML CSS支援

安裝次數:390萬

Live Server


必備伺服器是實時伺服器。它允許您使用實時伺服器開啟任何HTML檔案。因此,對檔案所做的任何更改都會在儲存檔案時反映出來。當您使用React時,可以將其視為熱過載。它為我節省了很多時間,因為我不必繼續重新整理標籤來檢視新更改。只需儲存檔案,您的更改將立即反映出來!

看起來是這樣的:

從市場上下載:Live Server

安裝次數:870萬

很多人學習python,不知道從何學起。
很多人學習python,掌握了基本語法過後,不知道在哪裡尋找案例上手。
很多已經做案例的人,卻不知道如何去學習更加高深的知識。
那麼針對這三類人,我給大家提供一個好的學習平臺,免費領取視訊教程,電子書籍,以及課程的原始碼!

QQ群:810735403

Bracket Pair Colorizer 2


此副檔名允許使用相同的顏色來識別匹配的括號對。這對任何形式的巢狀程式碼都非常有用,因為它可以輕鬆識別特定括號的右括號。

使用情況如下:

從市場下載:Bracket Pair Colorizer 2

安裝次數:130萬

indent-rainbow


副檔名使程式碼中的凹痕變色,使您可以更輕鬆地編寫和理解程式碼,因為一眼就能識別出不同的凹痕黑色。

從市場下載:Indent Rainbow

安裝次數:110萬

Prettier - Code formatter


任何開發人員的必備擴充套件。使用Prettier,您可以輕鬆地自動設定程式碼格式,並且在大多數情況下都可以正常工作。

要將更漂亮的格式設定為預設格式程式,請使用開啟命令選項板,ctrl+shift+p然後搜尋Open Settings (JSON)。開啟設定後,在其中新增以下行:

"editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.formatOnSave": true,
  • 1
  • 2

現在,每次儲存程式碼時,漂亮的程式碼都會自動正確格式化。

運作方式如下:

從市場下載:更漂亮

安裝次數:8.2M

GitLens-Git supercharged


Gitlens增強了VS Code中內建的Git功能。它允許視覺化程式碼作者,儲存庫檢視,行懸停等等!您必須使用它來了解其全部潛力。

從市場下載:Gitlens

安裝次數:6.3M

JavaScript (ES6) code snippets


如果您是JavaScript開發人員,那麼會喜歡的。它為您提供各種JS程式碼片段,以使您的生活更輕鬆,並且您的編碼時間更短!

這是一個簡單的例子:


安裝次數:450萬

ES7 React/Redux/GraphQL/React-Native snippets


另一個節省時間的好方法!該擴充套件提供了React,Redux甚至JavaScript的程式碼片段。因此,您可以在幾秒鐘內生成無聊的樣板程式碼,從而可以自由地實現實際功能。

⚡這是一個React程式碼段: