2025-08-13 Line 訂單系統- Mac1
2025-08-13 Line 訂單系統- Mac1
Mac #1（前端）必裝 VS Code Extensions（2025 最新版）
下面是 2025 最新、正確、前端工程師（Vue 3）在 macOS + VS Code 必裝的 Extensions 清單，並且全部改成 目前 VS Code Marketplace 的「正確名稱」，不會再出現找不到的情況。
✅ Mac #1（前端）必裝 VS Code Extensions（2025 最新版）
① Vue (Official)
🔥 取代舊版 Volar — 目前 Vue 官方的唯一推薦
包含語法提示、TypeScript 支援、template intelligence。
你一定要裝這個（最重要）
② Vite（或 Vite Helper）
提供 Vite 專案相關的 snippets／命令支援
（有時候叫 Vite, 有時候叫 Vite Extension Pack，依你找到的名稱為主）
③ Tailwind CSS IntelliSense
提供 Tailwind CSS 自動補全、hover 預覽、class 分析、dark mode 支援
④ ESLint
讓 VS Code 能顯示語法錯誤、程式碼規則違規提示（紅線、黃線）
Vue + Vite 專案一定會用到
⑤ Prettier – Code Formatter
用來統一程式碼格式（縮排、空白、換行…）
搭配 ESLint 可以保持程式碼乾淨一致
⑥ Path Intellisense
自動補全檔案路徑，非常好用
例如打/comp就能找到components/
⑦ JavaScript Debugger (Built-in)
VS Code 內建，不需要再裝「Debugger for Chrome」
因為 Chrome Debugger extension 已被棄用
VS Code 目前使用 內建 Debugger + Chrome DevTools Protocol
（如果你看到有人說要裝 “Debugger for Chrome”，那是舊資訊）
🎯 你的前端開發環境應該安裝以下 6 個：
| 必裝？ | Extension 名稱（正確） |
|---|---|
| ⭐⭐⭐⭐⭐ | Vue (Official) |
| ⭐⭐⭐⭐ | Tailwind CSS IntelliSense |
| ⭐⭐⭐⭐ | ESLint |
| ⭐⭐⭐⭐ | Prettier – Code Formatter |
| ⭐⭐⭐⭐ | Path Intellisense |
| ⭐⭐⭐ | Vite（或 Vite Helper） |
| （免裝） | Debugger for Chrome（已廢棄） |
📌 補充：為什麼找不到「Volar」？
✔️ 因為 Volar 已經被官方併入「Vue (Official)」
✔️ 2024 之後所有 Vue 3 官方教學都改用 Vue (Official)
✔️ Volar extension 已經不再建議安裝
你看到的：
- Volar - Plan, Review & Build with AI → 不是語法支援，是別人做的 AI 工具
- Vue (Official) → 才是你需要的
如果你願意，我可以幫你檢查
你現在可以貼上你的 VS Code 已安裝 extensions 截圖，我幫你確認是否正確完整。