對齊 Unicode 欄位的中文字型
需求說明
在 VSCode 中，若你編輯含有中文、全形符號或 Unicode 特殊字元的文件，常會遇到字寬不一致、無法垂直對齊的問題。這些問題即使使用等寬英文字體仍可能出現，特別是涉及 CJK 字元時。
推薦中文字型
以下字型能較好地處理中文等寬排列問題：
- SimSun-ExtB（新細明體擴展）：支援繁體與 Unicode 擴展字元
- MS Gothic：日文等寬字體，對 CJK 顯示效果穩定
- 仿宋：等寬中文印刷風格，視覺一致性高
- 標楷體：繁體中文書寫字型，排版均衡
設定方式
開啟 settings.json（快捷鍵 Ctrl + Shift + P → 輸入「Preferences: Open Settings (JSON)」），加入以下設定：
"editor.fontFamily": "'SimSun-ExtB', 'MS Gothic', '仿宋', '標楷體', monospace"此設定會依序嘗試載入字型，若前者未安裝則 fallback 到下一個。
建議補充設定
"editor.fontLigatures": false：避免字型合併導致對齊問題"editor.renderWhitespace": "all"：顯示空白字符，便於調整格式"editor.lineHeight": 22：視字體大小微調行高以避免上下重疊
注意事項
- 若字體未正確安裝於系統，VSCode 將跳過該字體
- 建議搭配「全形空格」手動調整對齊時使用
- 部分中文字型在 VSCode 中顯示為非等寬，需實測確認
結論
若希望在 VSCode 中使用繁體中文字型實現 Unicode 欄位整齊對齊，可透過 SimSun-ExtB、MS Gothic、仿宋、標楷體 等進行組合設定，並啟用輔助設定強化對齊效果。
在 Visual Studio Code 中將所有空格轉換為 Tab
1. 打開指令面板
- 按下 `Ctrl + Shift + P`（macOS 使用 `Cmd + Shift + P`）以打開指令面板。 - 輸入 **「Convert Indentation to Tabs」**，並選擇它。2. 確認當前縮排類型
- 查看右下角狀態欄，檢查當前檔案的縮排類型（例如 `Spaces: 4`）。 - 點擊該區域以打開縮排設定選單。3. 轉換縮排為 Tab
- 在選單中選擇 **「Convert Indentation to Tabs」**，這將把所有用於縮排的空格替換為 Tab。4. 調整 Tab 寬度（可選）
- 再次點擊右下角的縮排設定（例如 `Tab Size: 4`）。 - 設置您需要的 Tab 寬度（例如 `4`）。5. 儲存檔案
- 轉換完成後，按下 `Ctrl + S`（macOS 使用 `Cmd + S`）儲存檔案。6. 設定預設縮排為 Tab（可選）
如果希望所有檔案預設使用 Tab，可以按以下步驟設置：步驟 1：打開設定
- 按下 `Ctrl + ,`（macOS 使用 `Cmd + ,`）以打開設定選單。步驟 2：搜尋縮排設定
- 搜尋 **「Editor: Insert Spaces」**。 - 取消勾選該選項以改為使用 Tab。步驟 3：設置 Tab 寬度
- 搜尋 **「Editor: Tab Size」**。 - 設置您想要的 Tab 寬度（例如 `4`）。步驟 4：應用於工作區（可選）
- 如果只希望這些設定應用於當前工作區，打開 **工作區設定** 頁籤進行調整。總結
按照上述步驟，您可以輕鬆地在 Visual Studio Code 中將所有空格轉換為 Tab，並根據需求進行預設設定。VS Code 切換程式碼折疊顯示
手動切換折疊
- 折疊當前範圍：Ctrl + Shift + [（Windows/Linux），Cmd + Option + [（Mac）
- 展開當前範圍：Ctrl + Shift + ]（Windows/Linux），Cmd + Option + ]（Mac）
- 折疊所有區塊：Ctrl + Shift + Alt + [（Windows/Linux），Cmd + Option + Shift + [（Mac）
- 展開所有區塊：Ctrl + Shift + Alt + ]（Windows/Linux），Cmd + Option + Shift + ]（Mac）
設定啟用或停用折疊功能
- 開啟設定（Ctrl + , 或 Cmd + ,）。
- 搜尋 Editor > Folding。
- 切換 Editor: Folding 設定：
- 開啟（預設）： 允許折疊範圍。
- 關閉： 停用折疊功能。
或直接編輯 settings.json：
{
"editor.folding": false
}特定區塊折疊
- Python、C#、JavaScript： 使用
#region和#endregion。 - C、Java、JavaScript： 折疊大括號
{...}。 - Python、YAML： 使用縮排來折疊。
擴充功能
- 可使用 Folding 或 Better Comments 擴充功能來增加折疊控制。
從編輯器切換到檔案總管的快捷鍵
使用內建快捷鍵
- Windows / Linux：
Ctrl + Shift + E - Mac：
Cmd + Shift + E
按下該快捷鍵後，焦點將從編輯器切換到「檔案總管」（Explorer）視窗。
自訂快捷鍵
- 按
Ctrl + K Ctrl + S（Windows/Linux）或Cmd + K Cmd + S（Mac）開啟快捷鍵設定。 - 搜尋 「focus on explorer」，找到
workbench.view.explorer。 - 點擊該項目，設定你想要的快捷鍵，例如
Ctrl + Alt + E。
手動設定 `keybindings.json`
如果要手動修改 JSON 設定，可以在 keybindings.json 加入以下內容：
[
{
"key": "ctrl+alt+e",
"command": "workbench.view.explorer"
}
]測試快捷鍵
- 確保開啟了一個程式碼檔案並位於編輯器內。
- 按下
Ctrl + Shift + E或你自訂的快捷鍵。 - 焦點應該會切換到左側的檔案總管。
VSCode 使用游標位置的檔名進行 Go To File
方法 1：使用 Ctrl + P 並複製當前單詞
- 將游標放在檔案名稱上。
- 按
Ctrl + Shift + ←（Mac:Cmd + Shift + ←）選取檔名。 - 按
Ctrl + C（Mac:Cmd + C）複製檔名。 - 按
Ctrl + P（Mac:Cmd + P）開啟 Go To File 面板。 - 貼上檔名（
Ctrl + V或Cmd + V）並按Enter開啟檔案。
方法 2：使用 editor.action.goToImplementation
- 若檔案名稱在程式碼中被引用，如
import或require，可直接跳轉。 - 在檔案名稱上按
F12（跳轉到定義）。 - 或按
Ctrl + Click（Mac:Cmd + Click）。 - 若要在新分頁開啟，使用
Ctrl + Shift + Click。
方法 3：使用擴充套件 Quick File Open
若經常需要此功能，可安裝 Quick File Open 擴充套件，並設定快捷鍵，自動從游標位置提取檔案名稱並開啟。
3.1：擴充套件 Open file - Frank Stuetzer
- Extension Settings: Search paths : "Your path"
3.2：擴充套件 Open file From Path - jack89ita
- Extension Settings: open-file-from-path.regExp : default: "['|\"]([^'|\"]+)['|\"]"
VSCode 計算直欄選取區域的總和
基本說明
VSCode 雖支援直欄選取（Column Selection），但預設無內建功能可直接對選取區域的數值進行加總。不過你可透過以下幾種方法來達成此目的。
方法一：使用擴充套件
- Calculate（作者：Tomoki Hayashi）
- 功能：可對選取的數字進行加總、平均、最大值、最小值等操作
- 使用方式：
- 安裝後，選取你要的數字（可為直欄或一般多列）
- 右鍵選單 → 選擇
Calculate Sum - 結果會顯示在右下角或通知欄
方法二：複製至內建終端機計算
- 直欄選取數值後，按
Ctrl+C複製 - 貼到 VSCode 的終端機（或任何支援計算的 shell，如 Python REPL）
- 執行程式碼，例如：
# Python 範例
nums = [12, 15, 8, 10]
print(sum(nums))方法三：使用多重游標手動插入並導出
可將數值快速整理後，貼至 Excel、Google Sheets、或 Pandas 等工具中進行加總。
建議
若你經常需要進行這類操作，安裝 Calculate 擴充套件是最方便直接的做法。
VSCode 對選取行進行排序
功能說明
Visual Studio Code 支援對選取區域的多行文字進行排序，可依照字母順序、數字大小或反向排序，常用於程式碼整理、資料處理或清單編排。
使用方式
使用內建命令
- 選取欲排序的多行文字
- 開啟命令選單：
Ctrl + Shift + P - 輸入
Sort Lines Ascending（升冪）或Sort Lines Descending（降冪） - 按下 Enter，選取的行將立即排序
快捷鍵
預設未綁定快捷鍵，你可以自行設定：
- 前往 File → Preferences → Keyboard Shortcuts
- 搜尋
Sort Lines Ascending或Descending - 點選鉛筆圖示設定自定快捷鍵
進階排序（需擴充功能）
若需要自訂排序條件（例如：忽略大小寫、按欄位排序、自然數字排序等），可安裝以下擴充套件：
- Sort lines（作者：Tyriar）
- Natural Sort（支援自然排序，數字會以數值而非字串排序）
補充技巧
- 排序前可先使用
Alt + Shift + ↓ / ↑快速複製或移動行 - 搭配多重游標可同時排序多段資料
結論
VSCode 內建已支援基本的行排序功能，若有進階需求，可透過擴充套件擴展使用情境。
在 VSCode 瀏覽目前 Python 檔案的函式清單
使用大綱 (Outline) 面板
- 開啟 VSCode 的側邊欄 (Explorer)。
- 找到 大綱 (Outline) 面板，會自動顯示目前 Python 檔案的函式與類別。
- 如果沒有顯示，可以按
Ctrl + Shift + P（Mac:Cmd + Shift + P）開啟指令面板，輸入View: Show Outline並執行。
使用快速符號搜尋
- 按
Ctrl + Shift + O（Mac:Cmd + Shift + O）。 - 會顯示目前檔案的所有函式與類別清單，可點擊快速跳轉。
使用 @ 或 : 快速過濾
- 按
Ctrl + P（Mac:Cmd + P）開啟快速搜尋面板。 - 輸入
@來查看所有函式與類別。 - 輸入
:@來僅顯示 Python 類別與函式。
使用 Python 擴充套件
- 安裝 Microsoft 官方 Python 擴充套件，可在 大綱 (Outline) 面板中解析 Python 檔案，顯示函式與類別列表。
- 使用 IntelliSense 可自動補全函式名稱，並快速跳轉至定義。
VS Code 中使用 Git
初始化 Git 儲存庫
- 在 VS Code 中開啟專案資料夾。
- 按下左側活動欄中的「版本控制」圖示。
- 如果資料夾尚未初始化 Git，點擊「初始化儲存庫」按鈕。
連結遠端儲存庫
- 開啟終端機（
Ctrl + `或選單中選取「終端機」）。 - 輸入指令：
git remote add origin [遠端儲存庫網址]。 - 確認連結成功：
git remote -v。
新增檔案到版本控制
- 修改或新增檔案後，這些檔案會顯示在「變更」區域。
- 點選每個檔案旁的「+」按鈕，將其加入「暫存區」。
提交變更
- 在暫存區上方輸入提交訊息。
- 點擊「✔」按鈕進行提交。
推送至遠端儲存庫
- 點擊右上角的「...」選單，選擇「推送」。
- 或者在終端機輸入：
git push origin main（根據分支名稱調整）。
拉取遠端變更
- 點擊右上角的「...」選單，選擇「拉取」。
- 或者在終端機輸入：
git pull origin main。
檢視 Git 日誌
- 開啟終端機，輸入：
git log查看提交歷史。 - 或者使用 VS Code 擴充套件如「Git Graph」，圖形化查看。
VS Code 的 PHP 擴充套件
官方與常用擴充套件
- PHP Intelephense 提供智慧提示、自動補全、語法檢查、函式定義跳轉，是目前最常用的 PHP 擴充套件。
- PHP Debug 與 Xdebug 搭配，可在 VS Code 內設定斷點、單步執行、檢查變數。
- PHP Namespace Resolver 自動匯入 PHP 類別、介面與命名空間，避免手動輸入錯誤。
- PHP DocBlocker 協助自動產生 PHPDoc 註解，提升程式碼可讀性。
語法檢查設定
可在 settings.json 中設定 PHP 可執行檔路徑：
"php.validate.executablePath": "C:/php/php.exe"
除錯環境需求
- 安裝 PHP 並啟用 Xdebug。
- 安裝 VS Code 擴充套件 PHP Debug。
- 在
.vscode/launch.json設定除錯參數。
建議
若主要需求是程式編輯與自動完成，安裝 PHP Intelephense 即可；若需要除錯，務必搭配 PHP Debug 與 Xdebug。
設定 php.validate.executablePath 與所需擴充套件
必要擴充套件
在 Visual Studio Code 中使用 php.validate.executablePath 功能，無需安裝額外的 PHP 擴充套件，但需確認已安裝 PHP 執行檔於系統中。
建議安裝以下擴充套件以加強 PHP 開發體驗：
- PHP Intelephense（推薦）
- PHP Debug（若需要 Xdebug 除錯）
步驟一：安裝 PHP
- 至 PHP 官方網站 下載 PHP 並安裝
- 記下安裝位置，例如：
- Windows:
C:\\php\\php.exe - macOS/Linux:
/usr/bin/php或使用which php取得路徑
- Windows:
步驟二：設定 php.validate.executablePath
- 開啟 設定 (settings.json)，可透過命令選單輸入
Preferences: Open Settings (JSON) - 新增或修改以下內容：
"php.validate.executablePath": "C:\\php\\php.exe"（Linux/macOS 路徑範例："/usr/bin/php"）
步驟三：驗證設定
- 儲存
settings.json - 打開 PHP 檔案，若無錯誤顯示且語法檢查正常，表示設定成功
補充說明
- 如果 PHP 可執行檔不在系統 PATH 環境變數中，則必須明確設定
php.validate.executablePath - Intelephense 擴充功能不依賴此設定，但 PHP 語法錯誤檢查會用到
VS Code 中的 php.ini 路徑
設定方式
VS Code 本身沒有直接設定 php.ini 的選項，它是透過你在 settings.json 指定的 php.exe 來讀取對應的 php.ini。步驟如下：
- 先確認你的 PHP 安裝位置，例如：
C:\php\php.exe C:\php\php.ini - 在 VS Code 打開
settings.json（快捷鍵：Ctrl + ,→ 右上角「開啟設定 (JSON)」圖示）。 - 加入設定：
"php.validate.executablePath": "C:/php/php.exe" - 確保
php.ini與該php.exe屬於同一個 PHP 安裝路徑，這樣 VS Code 在語法檢查與除錯時，就會使用該php.ini。
檢查目前使用的 php.ini
- 在終端機輸入：
php --ini - 會顯示：
Configuration File (php.ini) Path: C:\php Loaded Configuration File: C:\php\php.ini
結論
在 VS Code 無法直接指定 php.ini，只能透過指定 php.exe 的路徑來間接指定使用哪個 php.ini。
VS Code 開發 Android App
是否可以直接開發
Visual Studio Code 本身不是完整的 Android Studio 替代品，缺乏官方 Android SDK 整合。但可以透過安裝擴充套件與設定環境，進行 Android App 開發。
常見方式
- Flutter / Dart：安裝 Flutter 與 Dart 擴充套件，可以在 VS Code 中快速開發跨平台 App，支援 Android、iOS。
- React Native：安裝 React Native Tools 擴充套件，使用 JavaScript / TypeScript 開發 Android 與 iOS App。
- Native 開發 (Java/Kotlin)：可寫程式碼，但需搭配 Android SDK、Gradle、命令列工具，編譯與模擬器運行通常仍需 Android Studio。
必要環境
- 安裝 Android SDK（通常透過 Android Studio 安裝）
- 安裝 Java JDK（若開發 Kotlin/Java 原生 App）
- 配置
ANDROID_HOME環境變數
建議
若希望輕量化開發，建議選擇 Flutter 或 React Native，在 VS Code 中即可完成大部分流程；但若需原生 Android App 深度開發與除錯，Android Studio 仍是主要工具。
在 VS Code 執行與除錯
啟動方式
- 開啟 VS Code 專案資料夾。
- 左側點擊 執行與除錯 (Run and Debug) 圖示，或使用快捷鍵
Ctrl+Shift+D。 - 若尚未有設定，點擊 建立 launch.json 檔案。
launch.json 設定
VS Code 使用 .vscode/launch.json 來定義執行與除錯方式，以下是不同語言的範例：
Node.js 範例
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "啟動 Node.js 程式",
"program": "${file}"
}
]
}
PHP (搭配 Xdebug)
{
"version": "0.2.0",
"configurations": [
{
"name": "Listen for Xdebug",
"type": "php",
"request": "launch",
"port": 9003
}
]
}
Python 範例
{
"version": "0.2.0",
"configurations": [
{
"name": "啟動 Python 程式",
"type": "python",
"request": "launch",
"program": "${file}",
"console": "integratedTerminal"
}
]
}
除錯功能
- 斷點：點擊行號即可設置。
- 單步執行：支援 Step Over、Step Into、Step Out。
- 檢視變數：在側邊欄可即時觀察變數內容。
- 呼叫堆疊：顯示目前程式呼叫順序。
提示
不同語言需安裝對應擴充套件，例如：
- Python → Python Extension
- PHP → PHP Debug (需搭配 Xdebug)
- C# → C# Dev Kit
- Java → Extension Pack for Java
設定整合式終端機使用 cmd 或 PowerShell
修改 settings.json
在 VS Code 中打開 settings.json，加入以下設定：
"terminal.integrated.defaultProfile.windows": "Command Prompt",
"terminal.integrated.profiles": {
"Command Prompt": {
"path": "C:\\Windows\\System32\\cmd.exe"
},
"PowerShell": {
"path": "C:\\Windows\\System32\\WindowsPowerShell\\v1.0\\powershell.exe"
}
}
效果
- 之後開啟新的整合式終端機，預設會使用
cmd.exe。 - 仍可從下拉選單手動切換到 PowerShell 或其他 shell。
注意
若你安裝了 Git Bash、WSL 或其他 shell，也可以在 profiles 區段中一併加入，方便切換。
案例：在 VS Code 設定除錯時使用 cmd，而預設終端機仍為 PowerShell
作法
VS Code 的「執行與除錯」使用的終端機可以透過 launch.json 中的 console 與 internalConsoleOptions 來控制。
範例設定
保留 PowerShell 為預設整合式終端機
"terminal.integrated.defaultProfile.windows": "PowerShell",
"terminal.integrated.profiles": {
"PowerShell": {
"path": "C:\\Windows\\System32\\WindowsPowerShell\\v1.0\\powershell.exe"
},
"Command Prompt": {
"path": "C:\\Windows\\System32\\cmd.exe"
}
}
在 launch.json 指定 Debug 用 cmd
{
"version": "0.2.0",
"configurations": [
{
"name": "啟動 Python 程式 (使用 cmd)",
"type": "python",
"request": "launch",
"program": "${file}",
"console": "integratedTerminal",
"internalConsoleOptions": "neverOpen",
"windows": {
"command": "cmd.exe"
}
}
]
}
效果
- 平常開啟新的終端機 → 預設仍是 PowerShell。
- 啟動 Debug → 自動在
cmd.exe裡執行。
PHP v: 7.4.10
email: [email protected]
