Visual Studio Code使用教學
Visual Studio Code 使用教學手冊 完整的 VS Code 開發環境設定與實戰指南 涵蓋前端 (Vue 3 + TypeScript) 與後端 (Spring Boot) 開發,適用於團隊協作與企業級專案開發 文件範圍與適用對象:本手冊面向前後端開發人員、平台/DevOps 工程師與 IT 治理團隊,內容涵蓋 VS Code 從安裝設定、日常開發、AI Agent 輔助開發,到團隊協作、企業級治理與部署維運的完整生命週期。文件依據 code.visualstudio.com/docs 官方文件系列查證撰寫,對應版本為 VS Code v1.134(2026 年 8 月);由於 GitHub Copilot/Agent 相關功能迭代速度遠快於核心編輯器(約每月釋出新版),第 3.6 節與第 6.9 節內容請視為該時間點的快照,正式導入前建議對照官方 Release Notes 複核最新異動。 📋 目錄 1. VS Code 安裝與環境設定 1.1 安裝步驟 1.2 推薦字型與主題 1.3 專案必要的 Extensions 清單 1.3.1 基礎開發工具 1.3.2 前端開發 1.3.3 後端開發 1.3.4 Python 開發 1.3.5 AI 輔助開發 1.3.6 一鍵安裝指令 1.4 設定同步功能 1.5 實務案例與注意事項 2. 專案開發環境配置 2.1 如何開啟專案 2.2 前端、後端工作區設定 2.3 編碼規範設定 2.3.1 前端編碼規範 (ESLint + Prettier) 2.3.2 後端編碼規範 (Checkstyle) 2.3.3 Maven 獨立安裝設定 2.4 容器化開發環境 (Dev Containers) 2.5 實務案例與注意事項 3. 日常開發操作 3.1 Git 與 GitHub/GitLab 整合 3.2 常用快捷鍵 3.3 偵錯與斷點設定 3.4 終端機與多工作區使用 3.5 程式碼片段 (Snippets) 使用 3.6 AI 輔助開發 — GitHub Copilot 3.6.1 程式碼自動完成與 Next Edit Suggestions 3.6.2 Copilot Chat 對話式助手 3.6.3 Inline Chat(行內聊天) 3.6.4 智慧動作 3.6.5 Agent 模式與工作階段 (Sessions) 3.6.6 權限與核准控制(含 Autopilot) 3.6.7 Plan Agent(計畫代理) 3.6.8 自訂指示檔 3.6.9 MCP 伺服器整合 3.6.10 Custom Agents(自訂代理) 3.6.11 Agent Skills(代理技能) 3.6.12 Prompt Files(提示檔案) 3.6.13 Hooks(生命週期鉤子) 3.6.14 語言模型選擇 3.6.15 Agent Plugins(代理外掛) 3.7 實務案例與注意事項 4. 專案特定開發流程指引 4.1 前端開發流程 4.2 後端開發流程 4.3 全端開發工作流程 4.4 程式碼品質檢查 4.5 效能監控與分析 4.6 實務案例與注意事項 4.7 Python 開發環境設定 4.7.1 Python 專案結構 4.7.2 Python 環境設定 4.7.3 Python 開發工具設定 4.7.4 Python 偵錯設定 4.7.5 Python 任務設定 4.7.6 Python 專案範例 4.7.7 Python 開發最佳實務 5. 協作開發功能 5.1 Live Share 即時協作 5.2 多人開發設定 5.3 程式碼審查工具 5.3.1 GitHub Pull Request 整合 5.3.2 GitLab Merge Request 整合 5.3.3 程式碼審查檢查清單 5.4 團隊協作最佳實務 6. 進階功能與擴充 6.1 自訂程式碼片段 6.2 擴充功能開發入門 6.3 工作流程自動化 6.3.1 Task 自動化 6.3.2 GitHub Actions 整合 6.3.3 GitLab CI/CD 整合 6.4 效能優化進階技巧 6.5 遠端開發與 SSH 6.6 工作區管理進階技巧 6.7 設定檔 (Profiles) 管理 6.8 Agent Customizations 編輯器 6.9 企業級管理與治理原則 (Enterprise Policies) 7. 最佳實務 7.1 常見問題 (FAQ) 與解決方式 7.2 建議的工作習慣 7.3 效能最佳化 7.4 安全性最佳實務 7.5 團隊協作規範 8. 檢查清單 8.1 新進成員快速上手檢查清單 8.2 日常開發檢查清單 8.3 部署前檢查清單 8.4 故障排除檢查清單 9. 附錄 9.1 參考資源 9.2 版本歷程 1. VS Code 安裝與環境設定 1.1 安裝步驟 1.1.1 下載與安裝 前往 Visual Studio Code 官方網站 點擊 “Download for Windows” 下載安裝檔 執行安裝檔,建議勾選以下選項: ✅ 新增至 PATH (在重新啟動後可用) ✅ 在檔案總管中的檔案上顯示「使用 Code 開啟」動作 ✅ 在檔案總管中的目錄上顯示「使用 Code 開啟」動作 ✅ 將 Code 註冊為支援的檔案類型的編輯器 1.1.2 首次啟動設定 啟動 VS Code 選擇適合的色彩主題 登入 Microsoft 帳戶(可選,用於同步設定) 1.2 推薦字型與主題 1.2.1 推薦字型 建議安裝並使用以下等寬字型: ...