我的 VS Code 套件清單

💰 表示需要付費

版本控管及協作工具

• GitLens

• Git File History：像坐時光機一樣依 Commit 看檔案變化史

• GitLab Workflow

• Jira and Bitbucket (Atlassian Labs)

• Figma for VS Code

AI 輔助

• 💰 GitHub Copilot

• GitHub Copilot Chat

• Codeium: AI Coding Autocomplete and Chat for Python, Javascript, Typescript, Java, Go, and more

程式語言支援及開發工具

• Pretty TypeScript Errors

• ES7+ React/Redux/React-Native snippets

• Tailwind CSS IntelliSense

• GraphQ

• Cucumber (Gherkin) Full Support

• change-case：快速轉換成 CONSTANT_CASE、camelCase、snake_case 等

• Code Spell Checker：拼字檢查，跟錯字說掰掰

• Turbo Console Log：選取變數按 ⌃ ⌥ L 就能快速插入帶檔名、行數與變數的 console.log()

• 💰 Wallaby.js

• 💰 Quokka.js：想要驗證一些簡單的程式碼，可以即時印出結果很方便！ 👍

主題及使用者介面

• Symbols

• Night Owl：本來常年使用，下載量超高！

• Dark Lavender：@t7yang 推友做的，剛換時雖然有點不太習慣，因為對比較強烈，但在閱讀起來很清楚，每個細節都很用心的主題！

程式碼格式化

• Prettier - Code formatter

• ESLint

程式碼註解

• TODO Highlight：可以讓 TODO、FIXME 或自定義類別的註解在程式碼內更顯眼，也可以快速列出指定註解類別的地方

• Highlight：基於正則表達式來變更文字顏色

其他工具及整合

• CodeSnap：將選取的程式碼變成美美的截圖

• Gremlins tracker for Visual Studio Code：揪出肉眼看不見的不合法字符

• Bookmarks

• SVG Previewer

• CodeSandbox

• Dev Containers：可以連到 Docker 的 Container 裡面開發

• Type Challenges：TypeScript 練習題