[VS Code] 入門-使用者設定

Basic setting

使用者設定

開啟設定面板 ：點擊左下角管理圖示〉選擇「設定」。

▎編輯器（新版）

新版VS Code預設的使用者設定會開啟「編輯器」，使用者可以更直覺的從「編輯器」中輸入參數值，依自己的喜好做相關設定。在編輯器面板左側，選單也劃分了各類頁籤(橘框處)，讓使用者做細部的設定時更加一目了然。

點擊更多操作(橘框處)，選擇「顯示修改的設定」，編輯器會顯示使用者自訂的部分(User Settings)。

舊版的使用者設定：點擊更多操作(橘框處)，選擇「開啟settings.json」。

▎settings.json（舊版）

舊版VS Code的使用者設定會開啟「settings.json」，使用者從預設設定(左)中選擇欲修改的參數，輸入自訂設定(右)中即可覆寫預設值。

左：預設設定(Default Settings) | 右：自訂設定(User Settings)

▎設定範例（json格式）

範例的設置並不是必要設定，依照個人的喜好習慣，調整成自己最舒服的編碼環境就好。

字體：FiraCode

"editor.fontFamily": "Fira Code"

tonsky/FiraCode

主題配色： Flatland Monokai Theme

"workbench.colorTheme": "Flatland Monokai"

Flatland Monokai Theme — Visual Studio Marketplace

自訂配色： 這邊的設定將覆寫原本的主題顏色。

"workbench.colorCustomizations": { 
  "activityBar.background": "#00897b",
  "sideBar.background": "#202325",
  "breadcrumb.focusForeground": "#80cbc4",
  "breadcrumb.activeSelectionForeground": "#6cffec",
  "list.hoverForeground": "#6cffec",
  "list.hoverBackground": "#26292b",
  "list.inactiveSelectionForeground": "#6cffec",
  "list.inactiveSelectionBackground": "#26292c",
  "list.inactiveFocusBackground": "#26292c",
  "list.focusForeground": "#ffffff",
  "list.focusBackground": "#26292b",
  "list.activeSelectionForeground": "#ffffff",
  "list.activeSelectionBackground": "#009688",
  "list.invalidItemForeground": "#5d8e89",
  "list.errorForeground": "#ff6d99",
  "list.warningForeground": "#bdd972",
  "editorGroup.border": "#1a1a1a",
  "tab.inactiveForeground": "#bfe1dd",
  "tab.activeForeground": "#5bdecd",
  "tab.activeBorder": "#5bdecd",
  "statusBar.background": "#202325"
}

更多自訂配色參考：

Visual Studio Code Theme Color Reference

相關文章

[VS Code] 入門-使用者設定
[VS Code] 入門-自訂鍵盤快捷鍵
[VS Code] 入門-安裝擴充套件
[VS Code] 入門-終端機與殼層
[VS Code] 入門-基本指令