website-rebuild-skill 是遵循 Agent Skills 開放規範設計的 AI 智能體技能，相容 Claude Code、Codex 與多種 Agent 執行環境。它將目標網站抓取為唯讀取證快照，從壓縮混淆後的程式碼逐行還原架構與邏輯，並透過控制台、網路、DOM、幾何與逐像素五層自動驗收門證明等價性。交付物涵蓋可獨立離線運行的原始碼工程、逆向筆記、差異登記表與版權取證報告。
website-rebuild-skill 將目標網址視為可執行的軟體規格書，而非外觀視覺參考。它以「先取證、後逆向、再驗收」為核心架構，把整站抓取為具備逐檔案 SHA-256 帳本的唯讀鏡像，隨後展開壓縮程式碼建立行號溯源座標系。
傳統靜態鏡像工具僅儲存靜態檔案，無法回答工程實作細節。本工具透過 51 個無外部依賴的 Node.js 工序腳本，在獨立工程內逐行重現模組結構、動畫編排狀態機與著色器邏輯，並以自動化比對門禁證明兩側運行結果等價。
驗收體系涵蓋控制台輸出、網路請求、DOM 樹拓撲、元素幾何邊界與無頭 Chromium 逐像素渲染對拍。未通過驗收的差異必須修復或於差異表完成登記，禁止以目測相似替代客觀驗證。
安裝前確認執行環境符合以下基礎依賴。Node.js 需為 22 或以上版本，以支援原生 fetch 與直連 Chrome DevTools Protocol (CDP) 的 WebSocket 通訊；同時需於本機安裝 Chrome 或 Chromium 以執行無頭像素比對。
| 依賴項目 | 最低版本 | 用途說明 |
|---|---|---|
Node.js |
>= 22.0.0 | 內建 fetch / WebSocket 直連 CDP，全工序腳本零外部 npm 依賴 |
Chrome / Chromium |
本機安裝 | 供 scripts/pixelcompare.mjs 執行無頭畫面擷取與像素差比對 |
npx |
隨 Node 內建 | 部分工序以子行程 spawn 固定版本外部工具（如 js-beautify、acorn） |
若已 clone 倉庫，將 skills/website-rebuild/ 完整資料夾複製到目標 Agent 的 skills 存放路徑：
--force 參數強制覆寫。執行前可加上 --dry-run 預覽寫入清單。
website-rebuild-skill 依據 Agent Skills 開放規範，將逆向工程拆解為八個標準工序。流水線在前項門禁未過前禁止推進至下一階段，確保每一步驟皆具備客觀裁判。
| 終點等級 | 回答問題 | 終止里程碑 | 典型交付用途 |
|---|---|---|---|
L1 鏡像存檔 |
它長什麼樣 | M0.5 | 純靜態存檔、斷網離線瀏覽、即將消失網站搶救保存 |
L2 工程化復刻 |
它在做什麼 | M(n) | 可運行與可驗收工程、行號可溯源 1:1 還原、含版權取證報告 |
L3 原始碼化 |
它怎麼做的 | M(n+1) | 語意命名模組、位元組重拼門保護、供研究與二次創作交接 |
website-rebuild-skill 的核心準則並非風格偏好，而是從數十個實戰目標（涵蓋 Apple、Lusion、Linear、Shopify 等）逆向過程中總結之硬約束。違反任一紀律皆會在後續驗收階段轉化為嚴重缺陷。
抓取所得之本地鏡像是全專案唯一客觀證據。任何後續的比對、驗收與反查皆以此為準，嚴禁以手動修改鏡像來掩蓋差異。
來源 · 官方 README · 六條紀律第 1 條嚴格禁止憑肉眼調整畫面效果。所有動畫時序、顏色變數與空間座標必須從壓縮程式碼中反解或提取，非由視覺臆測。
來源 · 官方 README · 六條紀律第 2 條寧可復刻初期畫面缺漏或排版不齊，亦不可自創邏輯補丁；源站未定義的行為一律不增添，確保逆向忠實度。
來源 · 官方 README · 六條紀律第 3 條壓縮程式碼中每個看似多餘的死程式碼或怪異語法，往往為實際行為的一環。修復源站缺陷會導致驗收門禁失效。
來源 · 官方 README · 六條紀律第 4 條因環境差異（如 WebGL 浮點精度、外部 API 替換）產生的分歧，必須寫入差異表記錄原因；未登記者一律判定為錯誤。
來源 · 官方 README · 六條紀律第 5 條每次程式碼變更必須同步更新 REBUILD_PLAN.md、差異登記表與逆向筆記，杜絕文檔與實作脫節。
來源 · 官方 README · 六條紀律第 6 條執行 pixelcompare 之前，必須使用 --self 參數在同側執行交錯對拍（≥4 次）取得雜訊底線，無頻寬之殘差一律視為未通過。
來源 · SKILL.md · references/verification-gates.md面對 Vite 等無模組容器的 ESM bundle，採用 slice-esm 按語意切片，並以 verify-reassembly 位元組重拼門禁定案。
來源 · SKILL.md · references/readable-source.md全站路由廣度驗證使用 sweep-routes 單一瀏覽器實例輪巡，單路由深度測試始調用 probe；避免頻繁重啟 Chrome 耗盡資源。
來源 · SKILL.md · Workflow M(n-1)產出工程一律預設為私有倉庫、加入 noindex 標籤且不自動部署。凡涉及是否公開或授權判斷，全數呈交使用者親自裁決。
來源 · 官方 README · 版權章節給定目標網址後，Agent 依序執行指紋探測、使用者終點裁決、唯讀鏡像落盤、壓縮程式碼逆向展開、逐行還原與逐像素驗收門禁。以下記錄單次會話內由判級直達原始碼化交付之真實互動流程。
傳統 AI 生成程式碼往往僅滿足「外觀相似」，在長度滾動、動畫中途停頓或特殊視窗解析度下極易發生破版。website-rebuild-skill 透過自比頻寬建立雜訊基準，並以客觀數值（meanAbsDiff 0.00）定案，確保重構過程不遺失原始細節。
復刻工程的終點止於「人能讀懂的真實」。將產出成果轉化為個人專案、進行腳手架抽離或二次創作時，應依循交接指引保持與源站偏離之可追溯性。
1. 透過 beyond-the-rebuild.md 完成工程交接。技能終點提供自帶之位元組清單與重拼門禁。進入二次創作或腳手架改造時，可精確記錄每一步對原始碼所做的偏離與客製改動。
2. 擴充專屬驗收門禁。參考 scripts/verify-*.mjs 撰寫業務專屬門禁，例如自訂音訊池檢查（零 404、零外聯）或長滾動幀率穩定性檢驗。
3. RSC Flight 串流重構。針對 Next.js App Router 站台，利用 flight-decode 解構服務端載荷，並以 verify-flight 雙射語意門校驗重構後之 React 組件樹。
4. 建立自研 WebGL 逆向筆記。參照 assets/templates/engine-notes.md 結構化記錄場景階層、自研著色器演算法與幾何資料封裝格式，累積圖形工程資產。
5. 整合 CI 自動化回歸測試。將 npm test（離線冒煙）與 npm run test:browser（真 Chrome 驗收）整合進 GitHub Actions，守護本地逆向成果。
① skills/website-rebuild/SKILL.md——全流程工序、判級標準與核心六大紀律完整規格。
② references/verification-gates.md——控制台、網路、DOM、幾何與逐像素五層驗收門禁詳解。
③ references/beyond-the-rebuild.md——復刻完成後的二次創作交接、腳手架化與偏離記錄準則。