Debug 不是苦工而是儀式：AI 輔助重構與測試的 Vibe Coding 工作流

修完的 Bug 過兩週換個姿勢回來，是多數人對除錯感到厭世的根源——因為只求「能動就好」，沒留下任何防止復發的東西。我習慣的 AI 輔助流程是先用測試重現 Bug、再修復、最後順手重構並讓測試持續通過，每次除錯都會留下更穩的程式碼和一條保護它的測試。這篇用 WordPress 與 Laravel 的實例，把這套儀式完整走一遍。

嗨，我是 Eric，浪花科技那個總是碎碎念只要鍵盤聲不對就寫不出 Code 的資深工程師。今天不談什麼高大上的系統架構，我們來聊聊每個工程師最痛苦、也最逃避不了的環節——Debug（除錯）、寫測試與重構。

坦白說，以前的我只要看到 Error Log 跳出那紅通通的一片，或是接手前人留下的「義大利麵程式碼（Spaghetti Code）」，心態通常是崩潰的。那時候的 Debug 是一種折磨，是不得不做的苦工。但自從 AI 工具（像是 GitHub Copilot、Cursor，甚至是 ChatGPT）進入我的開發流程後，一切都變了。

現在，我把這過程稱為「Debug 的儀式感」。這不再只是修復錯誤，而是一種運用 AI 進行「Vibe Coding」的流暢體驗。我們不再是孤獨的修水管工人，而是指揮 AI 代理人（Agent）的技術總監。這篇文章，就要帶你走一遍這套把痛苦轉化為享受的開發心法。

什麼是 Debug 的「儀式感」？從 Panic 到 Vibe

傳統的 Debug 流程通常長這樣：發現 Bug → 飆髒話 → 查 Log → Google 搜尋 → StackOverflow 複製貼上 → 再錯 → 再改 → 勉強能動 → 趕快 commit 祈禱不要壞。問題出在這條路徑沒有「回饋迴路」：你不知道 Bug 真正的根因，也沒有任何東西保證它不會再回來。

而結合了 AI 的 Vibe Coding 流程，是把它變成一條有節奏、可重複的迴圈：

1. 發現 Bug，深呼吸（儀式感開始）。
2. 把錯誤訊息與完整上下文丟給 AI，先討論「根本原因」而不是急著要解法。
3. 請 AI 撰寫一個會失敗的測試，把 Bug「重現」出來（紅燈）。
4. 修復程式碼，讓測試轉綠燈。
5. 在測試保護下，請 AI 協助重構這段程式碼。
6. 測試依然全綠，喝口咖啡，覺得自己像個藝術家。

這裡的關鍵在於：不要只求「修好」，要求「進化」。藉由 Bug 出現的契機，順便把那段爛 Code 重構，並補上測試。這就是工程師的 Vibe。下面三個階段，就是這條迴圈的具體拆解。

第一階段：與 AI 對話，精準定位病灶

很多新手用 AI Debug 最大的問題是「給的資訊太少」。直接丟一句「我的 WordPress 網站掛了」給 AI，它也救不了你。在 Vibe Coding 的流程中，我們要把 AI 當作一個資深的 Pair Programmer——而 Pair Programmer 需要的是「上下文」，不是謎題。

假設我們遇到一個 WordPress 自訂外掛的錯誤，使用了 wp_remote_get 卻回傳了非預期的內容，導致後續處理崩潰。

錯誤示範：上下文不足

幫我看這段 code 為什麼錯？
$response = wp_remote_get($url);
$body = wp_remote_retrieve_body($response);
$data = json_decode($body);
echo $data->title; // Error: Attempt to read property on null

這段提問的問題在於：AI 看不到你「預期」發生什麼。它只能猜，於是給你一個泛泛的答案。

Vibe Coding 的 Prompt 技巧：說清楚預期、實際、邏輯

一個好的除錯 Prompt 通常包含三件事：

• 預期行為（Expected）：這段程式碼「應該」做什麼。
• 實際結果（Actual）：它「實際上」噴了什麼錯、在哪一行。
• 商業邏輯（Context）：這段程式碼在整個流程中的角色。

套用到上面的例子，你可以這樣問：

「嘿，我正在處理一個 API 串接，目標是獲取產品標題。但是當 API 回傳非 200 狀態碼或是網路逾時的時候，這段程式碼會炸開。請幫我分析潛在的錯誤點，並提供一個防禦性程式設計（Defensive Programming）的修改版本。我們要優雅地處理錯誤，而不是讓它噴出 PHP Error。」

從原理上看，這段 WordPress 程式碼的脆弱點其實很典型：wp_remote_get 在連線失敗時會回傳一個錯誤物件，而不是回應陣列；就算成功，回傳的 body 也可能是空字串或不合法的 JSON。把這些可能性說清楚，AI 給的修改版本通常會主動加上錯誤檢查與 JSON 解析後的判斷，例如：

$response = wp_remote_get($url);

// 連線層級的失敗（DNS、逾時等）
if (is_wp_error($response)) {
    return null; // 或記錄 log、回傳預設值
}

// 檢查 HTTP 狀態碼
if (wp_remote_retrieve_response_code($response) !== 200) {
    return null;
}

$body = wp_remote_retrieve_body($response);
$data = json_decode($body);

// JSON 解析後與欄位存在性的雙重保護
if (!is_object($data) || !isset($data->title)) {
    return null;
}

return $data->title;

重點不在於這段程式碼是不是「標準答案」，而在於：當你把預期、實際、邏輯交代清楚，AI 不僅會修好 Bug，還會順手教你怎麼寫得更穩健。這就是把單向求救變成雙向對話。

第二階段：讓 AI 當你的測試工程師（QA）

說實話，大家都不愛寫測試。這就是 AI 最強大的地方：它不覺得寫測試很無聊。

這裡有一個容易被忽略的順序：在修復 Bug 之前，先要求 AI 寫一個會失敗的測試來「重現」這個 Bug。這就是測試驅動開發（TDD）紅—綠—重構迴圈的 AI 加速版。先有紅燈，你才能確定「這個測試真的測到了問題」；等你修完讓它轉綠，也才證明 Bug 真的被解決，而不是看起來好了。

舉個 Laravel 的例子，假設我們有一個計算訂單折扣的 Service，但負數金額會導致計算錯誤。我會這樣下指令：

「這是一個計算折扣的 OrderService 類別。請幫我用 Pest 寫一組測試，包含邊界測試（Edge Cases）：例如訂單金額為 0、金額為負數、或是折扣碼過期的情況。請確保這些測試目前是失敗的（Red）。」

為什麼要特別點名邊界條件？因為真正會出事的，往往不是那條快樂路徑（happy path），而是 0、負數、空值、過期、重複這些「角落」。把這些角落明確列進 Prompt，等於替 AI 畫好靶心。AI 會產出類似這樣的測試代碼：

// 支援經典編輯器的代碼區塊
it('throws exception when order amount is negative', function () {
    $service = new OrderService();
    expect(fn() => $service->calculateDiscount(-100, 'SAVE10'))
        ->toThrow(InvalidArgumentException::class);
});

看著 AI 幫你把測試骨架寫好，你只需要專注在「讓測試通過」，這種被輔助的感覺，就是 Vibe。更重要的是，這條測試會留下來，變成日後任何人改動這段邏輯時的安全網——你今天踩過的坑，不會有人在三個月後再踩一次。

第三階段：重構，把垃圾變黃金

Bug 修好了，測試通過了。傳統流程到這裡通常就結束了。但在「儀式感」流程中，這才是高潮的開始——而且有了上一階段的測試當保護網，重構這件原本最危險的事，現在變得相對安全。

既然這段程式碼已經打開了，為什麼不讓它變得更美？特別是那些充滿 if-else 地獄的舊代碼。我們可以利用 Cursor 的 Cmd+K 或是 Copilot Chat 進行重構，並在指令裡明確列出你要的改善方向：

「這段程式碼邏輯雖然正確，但可讀性很差。請幫我重構它：
1. 使用 Early Return 來減少巢狀層級。
2. 變數命名改為更具語義化的名稱。
3. 如果可以，使用 PHP 8.1 的 Enum 或 Match Expression 來優化判斷式。
請保持原有邏輯不變，確保剛剛寫的測試依然通過。」

這段 Prompt 之所以有效，是因為它做到三件事：給出具體手法（Early Return、語義化命名、Match）、設下明確邊界（保持邏輯不變），並交付驗收標準（測試要綠）。重構最大的風險就是「改著改著行為跑掉了」，而前一階段那組測試，正是讓你敢放手讓 AI 大改的底氣。

你會驚訝地發現，AI 往往能寫出比你當下還清楚的邏輯。這不僅是優化代碼，更是一個自我學習的過程。你看著 AI 的改寫，會心想：「喔！原來可以用 match 這樣寫，學到了。」每一次重構，都是一次小型的程式碼審查課。

Eric 的私房工具箱：打造除錯環境

要達成這種 Vibe，除了 AI，你的開發環境也不能馬虎。以下是我的必備組合，以及它們各自在這套流程裡扮演的角色：

• Cursor / VS Code + Copilot：這是基本盤。Cursor 的優勢在於它可以讀取整個專案的 codebase，給出的建議更貼合你既有的命名與架構，而不是憑空生出一段格格不入的程式碼。
• Xdebug：別再只會 var_dump 了。設好中斷點，你能逐行觀察變數在記憶體裡真實的樣子；配合 AI，你可以把觀察到的變數狀態描述給它，讓它幫你推理「為什麼到這一步值就不對了」。
• Query Monitor（WordPress） / Laravel Telescope：這些監控工具能讓你看見每一個 SQL 查詢、每一次 HTTP 外呼花了多久，找出那條拖慢整頁的慢查詢，再把它丟給 AI 討論怎麼優化。
• Git Commit 的儀式感：重構完後，請 AI 幫你寫 Commit Message：「Generate a conventional commit message for these changes, focusing on the refactoring of the discount logic.」一條清楚的 commit，是寫給未來那個忘記今天發生什麼事的你。

結論：享受與 AI 共舞的時光

把 Debug 變成儀式感，核心在於「心態的主動權」。整套流程其實可以濃縮成一句話：用測試重現、在保護下修復、趁機會進化。以前是被 Bug 追著跑，現在是你帶著 AI 獵犬去圍捕 Bug，並且順手把家裡（Codebase）打掃得乾乾淨淨。

當你下次遇到 Fatal Error 時，別急著焦慮。泡杯咖啡，打開你的 AI 助手，跟它說：「來吧，讓我們把這坨義大利麵變成五星級料理。」這就是屬於現代工程師的浪漫。

還是覺得系統維護很頭痛？

如果你覺得 Debug 和重構還是太花時間，或者你的企業系統已經龐大到需要專業團隊來進行現代化改造，別讓技術債拖垮你的業務。

浪花科技（Roamer Tech）擁有最資深的工程團隊，我們擅長將 AI 技術融入系統開發與維運。讓我們來幫你解決那些棘手的技術難題。立即聯繫我們，預約技術諮詢。

延伸閱讀

• Antigravity、Claude Code、Codex 三大 AI Coding Agent 完整比較
• Cursor AI 其實不是 Copilot 的對手？錯！深度解析：它想當的是你的『大腦外掛』
• AI 寫 Code 只是基本功？深度解析：AI Coding Agent 的真正價值是當你的『技術決策軍師』
• 告別資料庫垃圾山！利用 LLM 打造 CRM 自動化清洗流水線：從重複偵測到格式標準化的 AI 實戰