tower-defenselisted

# 無盡塔防遊戲快速製作 (tower-defense) 在幾分鐘內生出一個**可直接在瀏覽器執行**的 Canvas 2D 塔防遊戲。 技術路線**純原生**：HTML + CSS + 原生 JavaScript + Canvas 2D，零框架、零建置、零 npm。 ## 何時用這個 skill 當使用者要做塔防類遊戲：怪物沿路徑前進、玩家放砲塔攔截、守護女神。本模板特色： - **守護女神核心**：終點站著要守護的女神，怪物漏過攻擊她，可花金升級（加生命、解鎖聖光反擊） - **無盡隨機波次**：一波波無限生成、難度遞增、Boss 波、比拼最高波數 - **多種砲塔 + 升級**：弓箭(單體)、加農砲(範圍)、寒冰塔(減速)、電磁塔(穿透)，可升 6 級，外觀隨等級變化 - **元素克制 + 塔協同**：火/冰/雷互克；被減速/冰凍的敵人受傷 +25%（救活寒冰塔） - **可抽卡英雄**：抽英雄上場，地圖自走打怪、自我升級、四方向精靈圖，可指定駐守點 - **主動技能**：隕石、冰封、雷暴，有冷卻，緊急時手動施放 - **三難度模式**：普通(主流可過)/嚴酷/無盡煉獄，難度當社群鉤子（值得寫攻略） - **特殊事件波**：狂奔/精英/蟲潮/寶藏波，打破單調、製造驚喜 - **Meta 進度**：最高紀錄、魂晶、連殺 combo、暫停、低血告警、死亡分享戰績 ## 專案結構 ``` tower-defense/ ├── SKILL.md ├── art-config.json # ★ 美術生成設定（砲塔/怪物/技能提示詞） ├── index.html # 遊戲頁面 + HUD/UI 樣式 ├── src/ │ ├── config.js # ★ 資料層：塔/怪/技能/元素克制/平衡參數 │ ├── game.js # 核心引擎：Canvas 渲染、遊戲迴圈、波次、戰鬥 │ └── ui.js # HUD、建塔選單、技能列、升級面板 ├── assets/{towers,enemies,skills}/ # 美術圖（生成後放這） ├── scripts/gen-art.ps1 # 用 Grok 批次生成美術 └── references/data-model.md # 加塔/加怪/調平衡說明 ``` ## 快速開始（玩現成的） ```bash # 在 tower-defense 根目錄起 server python -m http.server 8000 # 開 http://localhost:8000/index.html ``` 玩法：選砲塔 → 點地圖空格建造（不能蓋路徑上）→ 點「開始下一波」→ 塔自動攻擊怪物 → 賺金錢升級/蓋更多塔 → 撐越多波越高分。 > ⚠️ 用 HTTP server 開（不要 file://），server 開在 `tower-defense/` 根目錄。 ## 核心設計原則（改動時請遵守） 1. **`config.js` 是資料層**：塔、怪、技能、元素克制、平衡都在這，改這裡即可調整。 2. **美術接點零侵入**：`game.js` 的 `drawSprite` 優先用 `assets/<group>/<id>.png`， 沒有才用 emoji。接美術不需改邏輯。 3. **無盡波次核心**：`start