Visual Studio Code



  • vscode/Vidual Studio Code 官網

    Visual Studio Code 快速鍵列表

    常用快速鍵

    編輯相關快速鍵

    多游標與選取

    檔案與視窗管理

    調試與執行

    搜尋與替換

    自訂快速鍵

    您可以透過 File > Preferences > Keyboard Shortcuts(或按 Ctrl + K + Ctrl + S)來自訂快速鍵設定。



    VSCode 的 Python 擴充套件

    如何安裝

    1. 開啟 VSCode,按 Ctrl + Shift + X(Mac: Cmd + Shift + X)開啟「擴充套件市集 (Extensions)」。
    2. 在搜尋欄輸入 Python,選擇 Microsoft 提供的官方 Python 擴充套件(藍色圖示)。
    3. 點擊 Install 安裝。

    主要功能

    語法高亮與 IntelliSense

    大綱 (Outline) 檢視函式與類別

    除錯 (Debugging)

    Python 環境管理

    Jupyter Notebook 支援

    推薦的 Python 相關擴充套件

    擴充套件名稱 功能描述
    Python (Microsoft) 官方 Python 支援,包含語法高亮、補全、除錯
    Pylance 提供更快的 IntelliSense 與型別檢查
    Jupyter 讓 VSCode 支援 Jupyter Notebook
    Python Environment Manager 方便管理 Python 虛擬環境
    Python Docstring Generator 自動產生 Python 註解 (Docstring)


    Visual Studio Code 的語法格式化

    1. 使用快捷鍵進行格式化

    Visual Studio Code 提供快捷鍵來快速格式化代碼: - **格式化整個檔案**:按 `Shift + Alt + F`(Windows)或 `Shift + Option + F`(Mac)。 - **格式化選定區域**:選取代碼後按上述快捷鍵。

    2. 啟用檔案儲存時自動格式化

    Visual Studio Code 支援自動格式化代碼: 1. 打開 **檔案 > 偏好設定 > 設定**。 2. 搜尋 **format on save**。 3. 勾選 **Editor: Format On Save**,儲存檔案時會自動格式化。

    3. 安裝格式化擴展工具

    1. 打開 **擴展市場**,搜尋並安裝適合的格式化工具,例如: - **Prettier - Code formatter**:適用於 JavaScript、TypeScript、HTML、CSS 等。 - **Black**:適用於 Python。 2. 安裝後,VS Code 會自動使用擴展工具進行格式化。

    4. 設定默認格式化工具

    如果安裝了多個格式化擴展工具,可以設定默認格式化工具: 1. 打開 **檔案 > 偏好設定 > 設定**。 2. 搜尋 **default formatter**。 3. 在 **Editor: Default Formatter** 中選擇要使用的工具。

    5. 自訂格式化規則

    部分格式化工具支援自訂規則,以下以 Prettier 為例: 1. 在專案目錄下建立 `.prettierrc` 文件。 2. 添加自訂規則,例如:
       {
           "tabWidth": 4,
           "useTabs": false,
           "singleQuote": true,
           "trailingComma": "es5"
       }
       

    6. 使用 .editorconfig 文件

    `.editorconfig` 用於統一團隊的代碼風格: 1. 在專案根目錄建立 `.editorconfig` 文件。 2. 添加規則,例如:
       [*.{js,css,html}]
       indent_style = space
       indent_size = 2
       

    7. 快速修復格式問題

    當格式問題出現時,使用快速修復功能: 1. 在問題代碼上點擊右鍵,選擇 **格式化文件** 或 **格式化選區**。 2. 使用快捷鍵執行快速修復。

    8. 總結

    - 使用快捷鍵快速格式化代碼。 - 啟用自動格式化功能提升效率。 - 安裝擴展工具以支援更多語言。 - 使用 `.editorconfig` 和工具特定的配置文件統一格式。

    將檔案從 Big5 編碼轉換為 UTF-8

  • 步驟1:在VS Code中開啟Big5編碼文件 開啟 Visual Studio 程式碼。 使用「檔案」->「開啟檔案」開啟以 Big5 編碼的檔案。
  • 步驟 2:將檔案編碼設定為 Big5 在 VS Code 的右下角,按一下編碼指示器(例如,預設可能會顯示 UTF-8)。 在出現的下拉清單中,選擇「使用編碼重新開啟」。 從編碼清單中,選擇 Big5。這告訴 VS Code 將文件解釋為 Big5 編碼。
  • 步驟 3:將編碼轉換為 UTF-8 文件開啟並正確顯示為 Big5 後,再次點擊編碼指示器。 現在,選擇使用編碼儲存。 從清單中選擇 UTF-8。
  • 第 4 步:儲存文件 選擇UTF-8後,Visual Studio Code會將檔案的編碼轉換為UTF-8並儲存。現在,您可以透過再次檢查編碼指示器來確認檔案是否為 UTF-8。

    在 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 切換程式碼折疊顯示

    手動切換折疊

    設定啟用或停用折疊功能

    1. 開啟設定(Ctrl + , 或 Cmd + ,)。
    2. 搜尋 Editor > Folding
    3. 切換 Editor: Folding 設定:
      • 開啟(預設): 允許折疊範圍。
      • 關閉: 停用折疊功能。

    或直接編輯 settings.json

    {
        "editor.folding": false
    }

    特定區塊折疊

    擴充功能



    VS Code 變更檔案編碼

    使用快捷鍵變更檔案編碼

    1. Ctrl + K Ctrl + S(Windows/Linux)或 Cmd + K Cmd + S(Mac)開啟快捷鍵設定。
    2. 點擊右上角「開啟 JSON」圖示,開啟 keybindings.json
    3. 加入以下設定,設定快捷鍵將檔案編碼變更為 UTF-8:
    [
        {
            "key": "ctrl+alt+u",
            "command": "workbench.action.editor.changeEncoding",
            "args": "utf8",
            "when": "editorTextFocus"
        }
    ]

    手動透過命令面板變更編碼

    1. Ctrl + Shift + P(Mac 使用 Cmd + Shift + P)。
    2. 搜尋 「Change File Encoding」(變更檔案編碼)。
    3. 選擇目標編碼,例如 UTF-8Big5

    常見編碼列表

    測試快捷鍵

    1. 打開一個非 UTF-8 編碼的檔案(如 Big5)。
    2. 按下 Ctrl + Alt + U(或你設置的快捷鍵)。
    3. 檔案應立即轉換為 UTF-8(無需手動選擇)。


    從編輯器切換到檔案總管的快捷鍵

    使用內建快捷鍵

    按下該快捷鍵後,焦點將從編輯器切換到「檔案總管」(Explorer)視窗。

    自訂快捷鍵

    1. Ctrl + K Ctrl + S(Windows/Linux)或 Cmd + K Cmd + S(Mac)開啟快捷鍵設定。
    2. 搜尋 「focus on explorer」,找到 workbench.view.explorer
    3. 點擊該項目,設定你想要的快捷鍵,例如 Ctrl + Alt + E

    手動設定 `keybindings.json`

    如果要手動修改 JSON 設定,可以在 keybindings.json 加入以下內容:

    [
        {
            "key": "ctrl+alt+e",
            "command": "workbench.view.explorer"
        }
    ]

    測試快捷鍵

    1. 確保開啟了一個程式碼檔案並位於編輯器內。
    2. 按下 Ctrl + Shift + E 或你自訂的快捷鍵。
    3. 焦點應該會切換到左側的檔案總管。


    VSCode 使用游標位置的檔名進行 Go To File

    方法 1:使用 Ctrl + P 並複製當前單詞

    1. 將游標放在檔案名稱上。
    2. Ctrl + Shift + ←(Mac: Cmd + Shift + ←)選取檔名。
    3. Ctrl + C(Mac: Cmd + C)複製檔名。
    4. Ctrl + P(Mac: Cmd + P)開啟 Go To File 面板。
    5. 貼上檔名(Ctrl + VCmd + V)並按 Enter 開啟檔案。

    方法 2:使用 editor.action.goToImplementation

    方法 3:使用擴充套件 Quick File Open

    若經常需要此功能,可安裝 Quick File Open 擴充套件,並設定快捷鍵,自動從游標位置提取檔案名稱並開啟。



    在 VSCode 瀏覽目前 Python 檔案的函式清單

    使用大綱 (Outline) 面板

    1. 開啟 VSCode 的側邊欄 (Explorer)。
    2. 找到 大綱 (Outline) 面板,會自動顯示目前 Python 檔案的函式與類別。
    3. 如果沒有顯示,可以按 Ctrl + Shift + P(Mac: Cmd + Shift + P)開啟指令面板,輸入 View: Show Outline 並執行。

    使用快速符號搜尋

    1. Ctrl + Shift + O(Mac: Cmd + Shift + O)。
    2. 會顯示目前檔案的所有函式與類別清單,可點擊快速跳轉。

    使用 @: 快速過濾

    使用 Python 擴充套件



    VS Code 中使用 Git

    初始化 Git 儲存庫

    連結遠端儲存庫

    新增檔案到版本控制

    提交變更

    推送至遠端儲存庫

    拉取遠端變更

    檢視 Git 日誌



    資訊與搜尋

    PHP v: 7.4.10
    email: [email protected]
    
    T:0000
    資訊與搜尋 | 回dev首頁 電話: 02-27566655 ,03-5924828 email: [email protected]