Visual Studio Code 的設定檔
Visual Studio Code 具有數百個設定、數千個擴充功能,以及無數種調整 UI 版面配置的方式來自訂編輯器。VS Code 設定檔可讓您建立自訂設定組合,並在它們之間快速切換或與他人共用。本主題說明如何使用設定檔編輯器建立、修改、匯出和匯入設定檔。
存取設定檔編輯器
設定檔編輯器可讓您從單一位置在 VS Code 中建立及管理您的設定檔。
您可以透過下列任一方式存取設定檔編輯器
-
從 檔案 > 喜好設定 > 設定檔 選單項目
-
從活動列底部的 管理 齒輪按鈕。
建立設定檔
VS Code 將您目前的組態視為 預設設定檔。當您修改設定、安裝擴充功能或透過移動檢視變更 UI 版面配置時,這些自訂設定都會在預設設定檔中追蹤。
若要建立新的設定檔,請開啟設定檔編輯器並選取 新增設定檔 按鈕。這會開啟新增設定檔表單,您可以在其中輸入設定檔名稱、選擇圖示,並設定新設定檔中包含的內容。
您可以選擇透過從設定檔範本或現有設定檔複製內容來建立新的設定檔,或建立 空白設定檔。空白設定檔不包含任何使用者自訂設定,例如設定、擴充功能、程式碼片段等等。
您可以限制新的設定檔僅包含組態的子集(設定、鍵盤快速鍵、程式碼片段、工作和擴充功能),並從預設設定檔中使用其餘組態。例如,您可以建立一個包含所有組態的設定檔,但鍵盤快速鍵除外,當此設定檔處於作用中狀態時,VS Code 將套用預設設定檔中的鍵盤快速鍵。
您可以在 內容 區段中瀏覽您要複製的範本或設定檔的內容。每個區段旁邊都有一個 開啟 按鈕,您可以選取該按鈕來查看其內容。
在建立新設定檔之前,請先選取 預覽 按鈕來預覽新設定檔。這會開啟一個新的 VS Code 視窗,並套用新的設定檔。如果您對預覽感到滿意,可以選取 建立 按鈕來建立新的設定檔。
檢查目前的設定檔
您可以在 VS Code UI 中的多個位置找到 VS Code 視窗目前正在使用的設定檔
-
在 VS Code 標題列中
-
當您將滑鼠游標停留在活動列中的 管理 按鈕上方時,在懸停文字中
如果您已為設定檔設定圖示,則此圖示會用作活動列中的 管理 按鈕。請注意,在下列螢幕擷取畫面中,「管理」按鈕現在具有麥克風圖示,表示設定檔已啟用。
如果您尚未設定圖示,則 管理 齒輪按鈕會顯示一個徽章,其中包含作用中設定檔的前兩個字母,以便您可以快速檢查您正在執行的設定檔。
-
在設定檔編輯器中
注意:如果您使用的是預設設定檔,則不會顯示設定檔名稱。
設定設定檔
您可以像變更任何 VS Code 組態一樣設定設定檔。您可以安裝/解除安裝/停用擴充功能、變更設定,以及調整編輯器的 UI 版面配置(例如,移動和隱藏檢視)。當您套用這些變更時,它們會儲存在您目前作用中的設定檔中。
資料夾與工作區關聯
當您建立或選取設定檔時,它會與目前的資料夾或工作區相關聯。每當您開啟該資料夾時,工作區的設定檔就會變成作用中。如果您開啟另一個資料夾,設定檔會變更為另一個資料夾的設定檔(如果已設定)。
您可以在 設定檔編輯器 的 資料夾與工作區 區段中查看與設定檔相關聯的資料夾清單。
管理設定檔
切換設定檔
您可以使用命令面板中的 設定檔:切換設定檔 命令快速在設定檔之間切換,該命令會顯示一個下拉式清單,列出您可用的設定檔。
您也可以從 設定檔編輯器 切換設定檔,方法是選取您要切換到的設定檔旁邊的 將此設定檔用於目前視窗 按鈕。
編輯設定檔
您可以在 設定檔編輯器 中編輯現有設定檔的名稱、圖示和其他組態。
刪除設定檔
您可以從 設定檔編輯器 刪除設定檔,方法是選取您要刪除的設定檔溢位動作中的 刪除設定檔 按鈕。
您也可以透過 刪除設定檔 命令刪除設定檔。刪除設定檔 下拉式清單可讓您選取要刪除的設定檔。
使用設定檔開啟新視窗
您可以使用設定檔編輯器中「設定檔內容」檢視中的 用於新視窗 選項,選擇要在開啟新的 VS Code 視窗時使用的設定檔。
您可以使用 檔案 > 使用設定檔開啟新視窗 選單,並選取您要使用的設定檔,直接為特定設定檔開啟新的 VS Code 視窗。
將設定套用至所有設定檔
若要將設定套用至您的所有設定檔,請使用設定編輯器中的 將設定套用至所有設定檔 動作。
從您的任何設定檔內更新此設定也會套用至所有其他設定檔。您可以隨時取消選取 將設定套用至所有設定檔 動作來還原此行為。
將擴充功能套用至所有設定檔
若要將擴充功能套用至您的所有設定檔,請選取「擴充功能」檢視中的 將擴充功能套用至所有設定檔 動作。
這會使此擴充功能在您的所有設定檔中都可用。您可以隨時取消選取 將擴充功能套用至所有設定檔 動作來還原此行為。
跨機器同步設定檔
您可以使用設定同步在不同機器之間移動您的設定檔。啟用「設定同步」並在 設定同步:設定 下拉式清單中選取 設定檔 後,您的所有設定檔都可在同步的機器上使用。
注意:VS Code 不會將您的擴充功能同步到或從遠端視窗同步,例如當您連線到 SSH、開發容器 (devcontainer) 或 WSL 時。
共用設定檔
匯出
您可以匯出設定檔以儲存或與他人共用,方法是使用您要匯出的設定檔溢位動作中的 匯出... 按鈕。
當您選取 匯出... 時,系統會提示您輸入設定檔名稱,以及您是否要匯出到 GitHub gist 或您的本機檔案系統。
儲存為 GitHub gist
將設定檔儲存到 GitHub 後(系統會提示您登入 GitHub),對話方塊會讓您選擇 複製連結,以便與他人共用您的設定檔 gist URL。URL 包含自動產生的 GUID,格式為 https://vscode.dev/editor/profile/github/{GUID}
。GitHub gist 會標記為 秘密,因此只有擁有連結的人才能看到 gist。
如果您啟動設定檔 URL,它會開啟適用於 Web 的 VS Code,並開啟「設定檔編輯器」和顯示匯入的設定檔內容。您可以取消選取設定檔元素(如果需要),如果您想繼續在 適用於 Web 的 VS Code 中使用該設定檔,則需要手動 安裝擴充功能(透過下載雲端按鈕)。
您也可以選擇 在 Visual Studio Code 中匯入設定檔,這會開啟 VS Code Desktop,並顯示設定檔的內容和 匯入設定檔 按鈕。
您可以在 https://gist.github.com/{username}
檢閱您的 gist。從您的 GitHub gist 頁面,您可以重新命名、刪除或複製 gist 的 GUID。
儲存為本機檔案
如果您選擇將設定檔儲存為本機檔案,「儲存設定檔」對話方塊可讓您將檔案放置在本機機器上。設定檔會以副檔名 .code-profile
的檔案儲存。
匯入
您可以從 設定檔編輯器 匯入現有的設定檔,方法是選取 新增設定檔 按鈕下拉式動作中的 匯入設定檔... 按鈕。
當您選取 匯入設定檔... 時,系統會透過 匯入設定檔 對話方塊提示您輸入 GitHub gist 的 URL 或設定檔的檔案位置。選取設定檔後,設定檔建立表單會開啟,並預先選取要匯入的設定檔。您可以繼續修改設定檔,然後選取 建立 來匯入設定檔。
設定檔的用途
設定檔是自訂 VS Code 以更符合您需求的絕佳方式。在本節中,我們將探討設定檔的一些常見使用案例。
由於設定檔會針對每個工作區記住,因此它們是自訂 VS Code 以適用於特定程式設計語言的絕佳方式。例如,您可以建立一個 JavaScript 前端設定檔,其中包含您在一個工作區中用於 JavaScript 開發的擴充功能、設定和自訂設定,並建立一個 Python 後端設定檔,其中包含您在另一個工作區中用於 Python 開發的擴充功能、設定和自訂設定。使用此方法,您可以輕鬆地在工作區之間切換,並始終以正確的方式設定 VS Code。
示範
在進行示範時,您可以使用設定檔來設定示範的特定組態。例如,您可以建立一個設定檔,其中包含一組特定的擴充功能和設定,例如縮放層級、字型大小和色彩佈景主題。這樣做,示範就不會搞亂您的正常 VS Code 設定,您可以自訂 VS Code 以在簡報期間獲得更好的可見性。
教育
設定檔可用於為學生自訂 VS Code,以簡化在課堂環境中的使用。設定檔可讓教育工作者與學生快速共用自訂的 VS Code 設定。例如,教育工作者可以建立一個設定檔,其中包含電腦科學課程所需的一組特定擴充功能和設定,然後與學生共用該設定檔。
回報 VS Code 問題
空白設定檔的其中一個用途是在您想要回報 VS Code 的問題時重設編輯器。空白設定檔會停用所有擴充功能和修改後的設定,因此您可以快速查看問題是因擴充功能、設定還是 VS Code 核心而起。
設定檔範本
VS Code 隨附一組預先定義的設定檔範本,您可以使用這些範本來自訂 VS Code 以適用於您的特定工作流程。若要根據範本建立新的設定檔,請在執行 建立設定檔 流程時選取設定檔範本。
Python 設定檔範本
Python 設定檔是 Python 開發的良好起點。它隨附 Python 特定的程式碼片段,並具有下列擴充功能
- autoDocstring - 自動產生 Python 文件字串。
- Docker - 建立、管理和偵錯容器化應用程式。
- Even Better TOML - 完整功能的 TOML 支援,例如
pyproject.toml
檔案。 - Python - IntelliSense、環境管理、偵錯、重構。
- Python Environment Manager - 管理 Python 環境和套件。
- Remote Development 擴充功能套件 - 支援 SSH、WSL 和開發容器。
- Ruff - 整合Ruff Python 程式碼檢查器和格式器。
此設定檔也設定下列設定
"python.analysis.autoImportCompletions": true,
"python.analysis.fixAll": ["source.unusedImports"],
"editor.defaultFormatter": "charliermarsh.ruff"
資料科學設定檔範本
資料科學設定檔是所有資料和 Notebook 工作的良好起點。它隨附特定的程式碼片段,並具有下列擴充功能
- Data Wrangler - 用於表格資料集和 Excel/CSV/Parquet 檔案的資料檢視、清理和準備。
- GitHub Copilot - 您的 AI 配對程式設計師。
- Jupyter - 在 VS Code 內使用 Jupyter Notebook。
- Python - IntelliSense、環境管理、偵錯、重構。
- Remote Development 擴充功能套件 - 支援 SSH、WSL 和開發容器。
- Ruff - 整合Ruff Python 程式碼檢查器和格式器。
此設定檔也設定下列設定
"[python]": {
"editor.defaultFormatter": "charliermarsh.ruff",
"editor.formatOnType": true,
"editor.formatOnSave": true
},
"editor.inlineSuggest.enabled": true,
"editor.lineHeight": 17,
"breadcrumbs.enabled": false,
"files.autoSave": "afterDelay",
"notebook.output.scrolling": true,
"jupyter.themeMatplotlibPlots": true,
"jupyter.widgetScriptSources": [
"unpkg.com",
"jsdelivr.com"
],
"files.exclude": {
"**/.csv": true,
"**/.parquet": true,
"**/.pkl": true,
"**/.xls": true
}
文件撰寫器設定檔範本
文件撰寫器設定檔是用於撰寫文件的良好輕量設定。它隨附下列擴充功能
- Code Spell Checker - 原始碼的拼字檢查器。
- Markdown Checkboxes - 將核取方塊支援新增至 VS Code 內建的 Markdown 預覽。
- Markdown Emoji - 將表情符號語法支援新增至 Markdown 預覽和 Notebook Markdown 儲存格。
- Markdown Footnotes - 將 ^footnote 語法支援新增至 Markdown 預覽。
- Markdown Preview GitHub Styling - 在 Markdown 預覽中使用 GitHub 樣式。
- Markdown Preview Mermaid Support - Mermaid 圖表和流程圖。
- Markdown yaml Preamble - 將 YAML 前言呈現為表格。
- markdownlint - Visual Studio Code 的 Markdown 程式碼檢查和樣式檢查。
- Word Count - 在狀態列中檢視 Markdown 文件中的字數。
- Read Time - 估計閱讀 Markdown 所需的時間。
此設定檔也設定下列設定
"workbench.colorTheme": "Default Light Modern",
"editor.minimap.enabled": false,
"breadcrumbs.enabled": false,
"editor.glyphMargin": false,
"explorer.decorations.badges": false,
"explorer.decorations.colors": false,
"editor.fontLigatures": true,
"files.autoSave": "afterDelay",
"git.enableSmartCommit": true,
"window.commandCenter": true,
"editor.renderWhitespace": "none",
"workbench.editor.untitled.hint": "hidden",
"markdown.validate.enabled": true,
"markdown.updateLinksOnFileMove.enabled": "prompt",
"workbench.startupEditor": "none"
Node.js 設定檔範本
Node.js 設定檔是所有 Node.js 工作的良好起點。它隨附下列擴充功能
- ESLint - 將 ESLint JavaScript 整合到 VS Code 中。
- Dev Containers - 在 Docker 容器內建立自訂開發環境。
- Docker - 建立、管理和偵錯容器化應用程式。
- DotENV - 支援 dotenv 檔案語法。
- EditorConfig for VS Code - Visual Studio Code 的 EditorConfig 支援。
- JavaScript (ES6) code snippets - ES6 語法中 JavaScript 的程式碼片段。
- Jest - 使用 Facebook 的 jest 測試框架。
- Microsoft Edge Tools for VS Code - 從 VS Code 內使用 Microsoft Edge 工具。
- npm Intellisense - 在 import 陳述式中自動完成 npm 模組。
- Prettier - Code formatter - 使用 Prettier 的程式碼格式器。
- Rest Client - Visual Studio Code 的 REST 用戶端。
- YAML - 具有內建 Kubernetes 語法的 YAML 語言支援。
此設定檔隨附下列設定
"editor.formatOnPaste": true,
"git.autofetch": true,
"[markdown]": {
"editor.wordWrap": "on"
},
"[json]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[jsonc]": {
"editor.defaultFormatter": "vscode.json-language-features"
},
"[html]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[typescript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
}
Angular 設定檔範本
Angular 設定檔是所有 Angular 工作的良好起點。它隨附下列擴充功能
- Angular Language Service - Angular 範本的編輯器服務。
- Angular Schematics - 整合 Angular schematics (CLI 命令)。
- angular2-switcher - 在 angular2 專案中輕鬆導覽至
typescript
|template
|style
。 - Dev Containers - 在 Docker 容器內建立自訂開發環境。
- EditorConfig for VS Code - Visual Studio Code 的 EditorConfig 支援。
- ESLint - 將 ESLint JavaScript 整合到 VS Code 中。
- JavaScript (ES6) code snippets - ES6 語法中 JavaScript 的程式碼片段。
- Jest - 使用 Facebook 的 jest 測試框架。
- Material Icon Theme - Visual Studio Code 的 Material Design 圖示。
- Microsoft Edge Tools for VS Code - 從 VS Code 內使用 Microsoft Edge 工具。
- Playwright Test for VSCode - 在 Visual Studio Code 中執行 Playwright 測試。
- Prettier - Code formatter - 使用 Prettier 的程式碼格式器。
- Rest Client - Visual Studio Code 的 REST 用戶端。
- YAML - 具有內建 Kubernetes 語法的 YAML 語言支援。
此設定檔設定下列設定
"editor.formatOnPaste": true,
"git.autofetch": true,
"[markdown]": {
"editor.wordWrap": "on"
},
"[json]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[jsonc]": {
"editor.defaultFormatter": "vscode.json-language-features"
},
"[html]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[typescript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"workbench.iconTheme": "material-icon-theme"
Java General 設定檔範本
Java General 設定檔是所有 Java 工作的良好起點。它自訂版面配置以改善 Java 體驗,並隨附Extension Pack for Java中的下列擴充功能
- Debugger for Java - 輕量型 Java 偵錯工具。
- IntelliCode - AI 輔助開發。
- IntelliCode API Usage Examples - 為超過 10 萬個不同的 API 提供程式碼範例。
- Language Support for Java(TM) by Red Hat - 基本 Java 語言支援、程式碼檢查、Intellisense、格式化、重構。
- Maven for Java - 管理 Maven 專案和建置。
- Project Manager for Java - 在 VS Code 內管理 Java 專案。
- Test Runner for Java - 執行和偵錯 JUnit 或 TestNG 測試案例。
Java Spring 設定檔範本
Java Spring 設定檔是所有 Java 和 Spring 開發人員的良好起點。它以 Java General 設定檔為基礎,並新增Spring Boot Extension Pack中的下列擴充功能
- Spring Boot Dashboard - 在您執行的 Spring 應用程式中提供 Spring Boot 即時資料視覺化和觀察。
- Spring Boot Tools - Spring Boot 檔案的豐富語言支援。
- Spring Initializr Java Support - 建立和產生 Spring Boot Java 專案的骨架。
此設定檔設定下列設定
"[java]": {
"editor.defaultFormatter": "redhat.java"
},
"boot-java.rewrite.reconcile": true
命令列
您可以透過 --profile
命令列介面選項,使用特定設定檔啟動 VS Code。您可以在 --profile
引數後傳遞設定檔的名稱,並使用該設定檔開啟資料夾或工作區。下列命令列會使用 "Web Development" 設定檔開啟 web-sample
資料夾
code ~/projects/web-sample --profile "Web Development"
如果指定的設定檔不存在,則會建立一個具有指定名稱的新空白設定檔。
常見問題
設定檔儲存在哪裡?
設定檔儲存在您的使用者組態下,類似於您的使用者設定和鍵盤快速鍵。
- Windows
%APPDATA%\Code\User\profiles
- macOS
$HOME/Library/Application\ Support/Code/User/profiles
- Linux
$HOME/.config/Code/User/profiles
如果您使用的是 Insiders 版本,則中間資料夾名稱為 Code - Insiders
。
什麼是暫時設定檔?
暫時設定檔是在 VS Code 工作階段之間不會儲存的設定檔。您可以使用命令面板中的 設定檔:建立暫時設定檔 命令來建立暫時設定檔。暫時設定檔會以空白設定檔開始,並具有自動產生的名稱(例如 Temp 1)。您可以修改設定檔設定和擴充功能,在 VS Code 工作階段的生命週期內使用設定檔,但關閉 VS Code 後就會刪除它。
如果您想要嘗試新的組態或測試擴充功能,而不想修改預設設定檔或現有設定檔,暫時設定檔會很有用。重新啟動 VS Code 會重新啟用工作區的目前設定檔。
我可以從另一個設定檔繼承設定嗎?
目前,無法從另一個設定檔繼承設定,在該設定檔中,您可以覆寫特定設定,並保留另一個設定檔中的其餘設定。我們正在 vscode 存放庫中的功能要求 中追蹤此問題。
當您建立新的設定檔時,您可以選擇從另一個設定檔或預設設定檔複製設定。這會在新的設定檔中建立設定的副本,但不會維護與您用作來源的設定檔的連結。
如何從我的專案中移除設定檔?
您可以將您的專案設定回預設設定檔。如果您想要移除所有設定檔工作區關聯,您可以使用 開發人員:重設工作區設定檔關聯,這會將目前指派設定檔的所有本機資料夾設定回預設設定檔。重設工作區設定檔關聯 不會刪除任何現有的設定檔。
為什麼匯出設定檔時,有些設定未匯出?
匯出設定檔時,不會包含機器特定的設定,因為這些設定不適用於另一部機器。例如,不會包含指向本機路徑的設定。
為什麼在建立新設定檔時,範本不可用?
設定檔範本由 VS Code 外部託管,您只能在連線到網際網路時下載和套用範本。如果您注意到設定檔範本不可用,請務必檢查您的網際網路連線。