實用VSCode 外掛,讓你的開發效率倍增

Auto Rename Tag

使用該外掛,可以在重新命名一個 HTML 標籤時,自動重新命名 HTML 標籤的開始和結束標籤。避免只修改了開始標籤,而忘記修改結束標籤。該擴充套件適用於 HTML、XML。

實用VSCode 外掛,讓你的開發效率倍增

Auto Close Tag

Auto Close Tag 外掛用於自動補全HTML結束標籤。

實用VSCode 外掛,讓你的開發效率倍增

實用VSCode 外掛,讓你的開發效率倍增

Code Runner

執行多種語言的程式碼片段或程式碼檔案:C、C++、Java、JavaScript、PHP、Python、Perl、Perl 6、Ruby、Go、Lua、Groovy、PowerShell、BAT/CMD、BASH/SH、F# Script、F#( 。NET Core)、C# 指令碼、C# (。NET Core)、VBScript、TypeScript、CoffeeScript、Scala、Swift、Julia、Crystal、OCaml Script、R、AppleScript、Elixir、Visual Basic 。NET、Clojure、Haxe、Objective-C 、Rust、Racket、Scheme、AutoHotkey、AutoIt、Kotlin、Dart、Free Pascal、Haskell、Nim、D、Lisp、Kit、V、SCSS、Sass、CUDA、Less、Fortran、Ring、標準 ML、Zig 和自定義命令

實用VSCode 外掛,讓你的開發效率倍增

Better Comments

一款美化註釋的外掛,可以根據不同種類的註釋,顯示不同的顏色,一目瞭然。

實用VSCode 外掛,讓你的開發效率倍增

GitLens

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

實用VSCode 外掛,讓你的開發效率倍增

Prettier - Code formatter

Prettier 是一個固執己見的程式碼格式化程式。 它透過解析您的程式碼並使用自己的規則重新列印它來執行一致的樣式,這些規則考慮了最大行長度,並在必要時包裝程式碼。

實用VSCode 外掛,讓你的開發效率倍增

Project Manager

用 vscode 經常在專案裡切換來切換去,Open Directory 效率太低,命令列

code 。

用著也不方便,這個 Project Manager 是解決這個痛點存在的:

左上是專案收藏面板,點選 “軟盤”圖示可以收藏當前專案,下次直接點選就切換。

左下是專案掃描,設定幾個目錄,會自動掃描這幾個目錄下面所有 svn/git 專案,雙擊切換。

有了這兩個面板,專案切換隨心所欲,想切就切。

實用VSCode 外掛,讓你的開發效率倍增

IntelliCode

從 GitHub 上高星的開源專案經過大量的機器學習訓練,給開發者提供最合適的 IntelliSense 上下文建議功能,除此之外,還有程式碼格式化和規則推測等功能。

實用VSCode 外掛,讓你的開發效率倍增

Beautify

Beautify 可以幫助我們以更美觀的方式格式化程式碼。它支援 JavaScript、JSON、CSS、Sass 和 HTML 等流行語言。

實用VSCode 外掛,讓你的開發效率倍增

Remote-SSH

Remote-SSH 可以使用任何帶有 SSH 伺服器的遠端機器作為開發環境。由於擴充套件直接在遠端伺服器上執行命令,因此無需在本地機器上放置原始碼即可快速操作遠端伺服器。

實用VSCode 外掛,讓你的開發效率倍增

Live Server

Live Server是一個具有實時載入功能的小型伺服器,可以在專案中用live-server作為一個實時伺服器實時檢視開發的網頁或專案效果。

它是為靜態和動態頁面啟動具有實時重新載入功能的本地開發伺服器,在狀態列中單擊即可啟動或停止伺服器。

實用VSCode 外掛,讓你的開發效率倍增

Color Highlight

此擴充套件可以用來設定 CSS 顏色的樣式。除了 CSS 之外,它還會對不顯示預設顏色的 JavaScript、HTML、JSON 等檔案進行著色。該外掛會對顏色名稱、RGB、RGBA 和十六進位制顏色進行著色。

實用VSCode 外掛,讓你的開發效率倍增

ES7 React/Redux/GraphQL/React-Native snippets

React/Redux/Reatc Native/react-router 語法智慧提示,React 開發者必備。藉助此程式碼段,可以輕鬆建立基於類的元件、function元件。

npm Intellisense

npm 安裝包之後,在 require 時提供該外掛可以獲得智慧提示,import 語句中自動填充 npm 模組。

實用VSCode 外掛,讓你的開發效率倍增

ESLint

將 ESLint 整合到 VS 程式碼中。

實用VSCode 外掛,讓你的開發效率倍增

Path Intellisense

路徑提示外掛

實用VSCode 外掛,讓你的開發效率倍增

Docker

Docker 擴充套件使從 Visual Studio Code 構建、管理和部署容器化應用程式變得容易。 它還提供容器內 Node。js、Python 和 。NET Core 的一鍵式除錯。

實用VSCode 外掛,讓你的開發效率倍增

HTML CSS Support

讓 html 標籤上寫class 智慧提示當前專案所支援的樣式

實用VSCode 外掛,讓你的開發效率倍增