1 優化 settings.json 文件
1.1 settings.json 簡介
????????settings.json 是 VS Code 的核心配置文件,用于存儲用戶的個性化設置和偏好。通過該文件,用戶可以自定義和覆蓋 VS Code 的默認行為,包括但不限于以下方面:
- 編輯器外觀(如主題、字體、顏色)
- 代碼格式化規則(如縮進、換行、格式化工具)
- 編程語言支持(如語法高亮、代碼補全、Lint 工具)
- 快捷鍵綁定
- 調試配置
- 工作區或文件夾的特定設置
????????settings.json 文件采用 JSON 格式,所有設置均以鍵值對的形式定義。其中:
- 鍵:設置的名稱(字符串類型)。
- 值:設置的配置內容,可以是字符串、數字、布爾值、數組或嵌套的 JSON 對象。
1.2 settings.json?配置
????????在 VS Code 中,用戶可以通過兩種方式配置 settings.json 文件,以自定義編輯器的行為和外觀:通過 UI 界面編輯,或直接修改 settings.json 文件。
1.2.1?通過 UI 界面編輯
- 打開 VS Code。
- 使用快捷鍵 Ctrl + ,(Windows/Linux)或 Cmd + ,(macOS)打開設置界面。
- 在搜索框中輸入需要調整的設置名稱,找到對應選項后,通過 UI 界面直接修改其值。
- 修改完成后,VS Code 會自動同步更新 settings.json 文件,保存用戶的更改。
1.2.2?直接編輯 settings.json 文件
????????除了通過 UI 界面修改配置,用戶還可以直接編輯 settings.json 文件:
文件位置:
- 全局配置文件通常位于用戶配置文件夾中,路徑為:
- Windows: C:\Users\<用戶名>\AppData\Roaming\Code\User\settings.json
- macOS: /Users/<用戶名>/Library/Application Support/Code/User/settings.json
- Linux: /home/<用戶名>/.config/Code/User/settings.json
- 或者,通過 VS Code 的命令面板(Ctrl + Shift + P 或 Cmd + Shift + P)輸入 Open Settings (JSON),快速打開配置文件。
- 如果你希望對所有項目應用相同的設置,選擇 Open User Settings (JSON)。
- 如果你希望為當前項目或工作區定制設置,選擇 Open Workspace Settings (JSON)。
- 如果你只是想查看 VS Code 的默認設置,選擇 Open Default Settings (JSON)。
編輯內容:
- 在文件中直接添加或修改配置項(例如,調整編輯器主題、啟用代碼格式化工具等)。
- 完成編輯后,保存文件即可使更改立即生效,VS Code 會自動應用新的配置。
- 后續內容中,我將提供一些推薦的配置項,你可以直接復制粘貼到?settings.json?文件中使用。具體操作步驟請參考后續說明。
設置范圍:
- 全局設置:影響所有 VS Code 實例和項目,存儲在用戶配置文件夾中。
- 工作區特定設置:僅影響當前工作區(項目或文件夾),存儲在工作區目錄下的 .vscode/settings.json 文件中。
- 示例:若項目文件夾中包含 .vscode/settings.json,則該文件中的配置會覆蓋全局設置。
????????通過靈活使用 settings.json 文件(包括全局和工作區特定配置),用戶可以根據個人編程習慣和工作流程,高度自定義 VS Code 的行為,從而提升開發效率。
1.3 推薦基礎配置
????????以下是針對 C/C++ 開發的推薦 settings.json 基礎配置,旨在提升編輯器的流暢性、代碼可讀性和開發效率。
{"editor.fontSize": 16,"editor.unicodeHighlight.allowedLocales": {"zh-hant": true},"files.autoSave": "afterDelay","files.autoGuessEncoding": true,"workbench.list.smoothScrolling": true,"editor.cursorSmoothCaretAnimation": "on","editor.smoothScrolling": true,"editor.cursorBlinking": "smooth","editor.mouseWheelZoom": true,"editor.formatOnPaste": true,"editor.formatOnType": true,"editor.formatOnSave": true,"editor.wordWrap": "on","editor.guides.bracketPairs": true,"editor.suggest.snippetsPreventQuickSuggestions": false,"editor.acceptSuggestionOnEnter": "smart","editor.suggestSelection": "recentlyUsed","window.dialogStyle": "custom","debug.showBreakpointsInOverviewRuler": true
}
????????你可以直接將以上代碼復制粘貼到 settings.json 文件中,如下所示:?
配置項解釋:
editor.fontSize
: 16:設置編輯器字體大小為 16。editor.unicodeHighlight.allowedLocales
: { "zh-hant": true }:啟用對繁體中文(zh-hant)的 Unicode 字符高亮顯示。files.autoSave
: "afterDelay":文件在延遲后自動保存,避免頻繁手動保存。files.autoGuessEncoding
: true:自動檢測文件編碼,減少亂碼問題。workbench.list.smoothScrolling
: true:啟用工作區列表(如文件資源管理器)的平滑滾動。editor.cursorSmoothCaretAnimation
: "on":光標動畫平滑,提升視覺體驗。editor.smoothScrolling
: true:啟用編輯器內容的平滑滾動。editor.cursorBlinking
: "smooth":光標平滑閃爍,減少視覺疲勞。editor.mouseWheelZoom
: true:允許通過鼠標滾輪縮放編輯器字體大小。editor.formatOnPaste
: true:粘貼代碼時自動格式化。editor.formatOnType
: true:輸入時自動格式化(如輸入分號后格式化代碼塊)。editor.formatOnSave
: true:保存文件時自動格式化。editor.wordWrap
: "on":啟用單詞換行,避免長行代碼超出視窗。editor.guides.bracketPairs
: true:顯示括號對引導線,提升代碼結構清晰度。editor.suggest.snippetsPreventQuickSuggestions
: false:允許代碼片段與快速建議同時顯示。editor.acceptSuggestionOnEnter
: "smart":智能接受建議(如僅在當前光標位置合適時接受)。editor.suggestSelection
: "recentlyUsed":優先顯示最近使用的建議。window.dialogStyle
: "custom":使用自定義對話框樣式,界面更現代化。debug.showBreakpointsInOverviewRuler
: true:在概覽標尺中顯示斷點,方便調試。
2 VS Code 快捷鍵大全
2.1 常用快捷鍵
功能 | Windows/Linux | macOS |
---|---|---|
打開命令面板 | Ctrl + Shift + P | Cmd + Shift + P |
打開設置 | Ctrl + , | Cmd + , |
打開文件 | Ctrl + P | Cmd + P |
新建文件 | Ctrl + N | Cmd + N |
打開最近的文件 | Ctrl + R | Cmd + R |
保存文件 | Ctrl + S | Cmd + S |
另存為 | Ctrl + Shift + S | Cmd + Shift + S |
關閉當前文件 | Ctrl + W | Cmd + W |
關閉所有文件 | Ctrl + K Ctrl + W | Cmd + K Cmd + W |
撤銷 | Ctrl + Z | Cmd + Z |
重做 | Ctrl + Y ?或?Ctrl + Shift + Z | Cmd + Y ?或?Cmd + Shift + Z |
剪切 | Ctrl + X | Cmd + X |
復制 | Ctrl + C | Cmd + C |
粘貼 | Ctrl + V | Cmd + V |
查找 | Ctrl + F | Cmd + F |
替換 | Ctrl + H | Cmd + H |
格式化代碼 | Shift + Alt + F | Shift + Option + F |
切換全屏 | F11 | F11 ?或?Ctrl + Cmd + F |
2.2 全局
2.3 基本編輯
2.4 導航
2.5 查找和替換
2.6 多光標和選擇
2.7 多語言編輯
2.8 編輯器管理
2.9 文件管理
2.10 顯示
2.11 調試
2.12 集成終端
3 VS Code 實用插件推薦
3.1 外觀主題類
GitHub Theme
????????GitHub Theme 是一款備受歡迎的 VS Code 插件,它復刻了 GitHub 網站的代碼高亮和界面風格。安裝此插件后,開發者可以在 VS Code 中獲得與 GitHub 相似的代碼閱讀體驗,提升代碼編寫和審查的效率。
????????只需點擊 “設置顏色主題”,然后選擇你喜愛的主題即可立即應用。
3.2 圖標主題類
Material Icon Theme
????????Material Icon Theme 是一款廣受歡迎的 VS Code 插件,它為文件和文件夾提供了 Material Design 風格的圖標,顯著提升了編輯器的視覺體驗。這款插件使界面更現代美觀,并通過圖標直觀展示文件類型和結構,幫助開發者快速導航和識別項目文件。安裝后,你將享受更直觀、高效的編碼環境。
????????部分圖標樣式展示如下:?
3.3 基礎功能類
Error Lens
????????Error Lens 是 VS Code 中一款極為實用的插件,旨在提升開發者的編碼體驗和效率。它能夠在代碼行內實時顯示規范錯誤、邏輯問題及警告等診斷信息,通過高亮和內聯的方式呈現,讓開發者無需頻繁切換至控制臺或問題面板,即可直觀地發現并快速定位代碼中的潛在問題。
?????????顯示規范錯誤樣式展示如下:
Path Intellisense
????????Path Intellisense 是 VS Code 中一款極為實用的插件,專注于提高開發者在編寫文件路徑時的效率和準確性。借助自動完成功能,該插件能在開發者輸入文件或文件夾路徑時,即時提供路徑建議,顯著節省查找和輸入路徑的時間,并減少因路徑錯誤引發的編譯或運行問題。
????????Path Intellisense 支持多種路徑格式,涵蓋相對路徑(以 ./ 開頭)、工作區絕對路徑(以 / 開頭)、文件系統絕對路徑(如 C: 開頭),以及相對于用戶文件夾的路徑(以 ~ 開頭)。此外,它還支持部分路徑的自動補全,允許通過配置選項排除特定項目或文件夾,并支持自定義路徑映射和轉換,滿足多樣化的開發需求。
Image preview
????????Image Preview 是 VS Code 中一款極為實用的插件,它讓開發者無需離開編輯器或使用外部工具,即可直接在 VS Code 中預覽圖片。這一功能對前端開發者、網頁設計師及需頻繁查看和修改圖片資源的開發者而言,極為便捷。
????????通過 Image Preview 插件,開發者只需將鼠標懸停在代碼中的圖片路徑上,即可即時預覽圖片,顯著提升工作效率。此外,該插件支持 PNG、JPG、GIF、SVG 等多種圖片格式,滿足各種開發場景的需求。
Code Runner
????????Code Runner 是 VS Code 中一款實用的插件,支持多種編程語言,允許用戶一鍵運行代碼并直接在終端查看輸出結果,無需切換工具或命令行,極大提升了代碼測試與驗證的效率,是開發者快速調試和學習的得力助手。
? ? ? ? 你可通過點擊運行按鈕旁的下拉箭頭,在展開的選項中選擇 “Run Code” 來運行程序;也可使用其對應的快捷鍵 “Ctrl + Alt + N” 直接運行程序。
????????此外,還能通過鼠標右鍵菜單選擇 “Run Code” 執行運行操作。
3.4 擴展功能類
CodeSnap
????????CodeSnap 是 VS Code 中一個備受歡迎的代碼截圖插件,讓開發者能夠輕松捕獲并保存代碼的屏幕截圖。這款插件提供了直觀的操作界面和豐富的配置選項,支持自定義截圖樣式和導出方式。通過 CodeSnap,開發者可以快速將代碼片段轉化為高質量的圖像,方便在文檔、教程或演示中分享,極大地提升了代碼展示的效果和便捷性。
? ? ? ? 操作步驟如下圖所示:?
Prettier - Code formatter
????????Prettier - Code formatter 是 VS Code 中備受歡迎的代碼自動格式化插件。它通過解析代碼并應用預設規則重新排版,確保代碼風格一致,同時考慮最大行長度并自動換行。Prettier 遵循 “固執己見” 的設計原則,不允許自定義格式化規則,從而避免個人偏好導致的代碼風格差異。
????????在 VS Code 中安裝 Prettier 后,開發者可通過快捷鍵(如 Shift + Alt + F)快速格式化整個文檔或選中代碼塊,也可配置為保存文件時自動格式化。該插件支持多種編程語言和文件類型,是前端、后端開發者及所有注重代碼整潔性人士的必備工具。
GBK to UTF8 for vscode
????????GBK to UTF8 for vscode 是 VS Code 中的一個實用插件,主要用于實現 GBK 和 UTF-8 編碼之間的轉換。該插件通過簡單的操作,能夠輕松解決因編碼不一致而導致的中文亂碼問題,特別是對于處理舊項目或舊代碼時尤為有用。
????????當從 VS code 中打開帶有 GBK 相關編碼文件的時候,會自動彈出提示框提示是否轉換,或者你可以在命令面板中通過 Convert encoding to UTF8 命令手動轉換。
????????你還可以批量轉換文件編碼,選中左側文件瀏覽樹中的多個文件,或者選擇文件夾,右鍵單擊并從上下文中選擇 Convert encoding to UTF8 選項來批量轉換。
Hex Editor
????????Hex Editor 是 VS Code 中一個強大的插件,它允許開發者以十六進制模式查看和編輯文件。這款插件不僅提供了直觀的界面來展示文件的二進制數據,還集成了多種實用的編輯功能,如撤銷/重做、復制/粘貼以及查找和替換等。
? ? ? ? 操作方法如下所示:
????????右鍵當前文件選項卡,選擇 “重新打開編輯器的方式”:
? ? ? ? 然后選擇 “十六進制編輯器”:?
? ? ? ? 即可查看內容:?
Doxygen Documentation Generator
????????Doxygen Documentation Generator 是? VS Code 中一個非常實用的插件,專注于幫助開發者自動生成和管理源代碼文檔。該插件基于 Doxygen 工具,能夠將代碼中的注釋、函數說明、類結構等信息轉換為清晰、易讀的文檔格式,如 HTML、LaTeX 等。
????????對于使用 Doxygen 作為文檔化標準的項目而言,Doxygen Documentation Generator 插件無疑是一個不可或缺的輔助工具。它不僅能夠提升文檔編寫的效率和質量,還能夠促進團隊協作和代碼共享。因此,對于希望在 VS Code 中輕松生成和管理源代碼文檔的開發者而言,Doxygen Documentation Generator 插件是一個值得推薦的選擇。
Hungry Delete
????????Hungry Delete 是 VS Code 中一個實用的插件,它旨在增強編輯器的刪除操作體驗。通過 Hungry Delete 插件,用戶在刪除文本時可以獲得更加智能和高效的行為。具體來說,該插件能夠識別并刪除與當前光標位置相關聯的額外字符或代碼塊,比如多余的空格、制表符、括號對中的一部分等,從而幫助開發者保持代碼的整潔和一致性。
- Windows 和 Linux 中的快捷鍵 : Ctrl + Backspace
- Mac 中的快捷鍵:? Alt + Backspace
3.5 智能編程助手
CodeGeeX
????????CodeGeeX 是一款基于大模型的智能編程助手,功能全面且強大。它能實現代碼生成與補全,自動添加注釋、解釋代碼邏輯,還能編寫單元測試、進行代碼審查、修復代碼 bug,甚至自動生成 commit message 以完成 git 提交。此外,CodeGeeX 支持不同編程語言間的代碼互譯,能針對技術和代碼問題提供智能問答。憑借這些功能,它可大幅提高開發者工作效率。而且,CodeGeeX 支持 300 + 種編程語言,適配 Visual Studio Code、JetBrains IDEs 等多種主流 IDE 平臺,為開發者帶來便捷高效的編程體驗。
? ? ? ? 官方使用說明文檔:https://zhipu-ai.feishu.cn/wiki/CuvxwUDDqiErQUkFO2Tc4walnZY?
? ? ? ? 插件功能簡易演示:
4 插件離線安裝方法
????????有時由于網絡原因,在線下載 VS Code 插件擴展可能會非常緩慢。如果本地已經存在對應的插件擴展包,可以通過導入的方式直接安裝插件,具體操作流程如下: