"""
__  ______       _                   _____        ___         ___
\ \/ /  _ \  ___| |__  _   _  __ _  |___ /       / _ \       / _ \
 \  /| | | |/ _ \ '_ \| | | |/ _` |   |_ \      | | | |     | | | |
 /  \| |_| |  __/ |_) | |_| | (_| |  ___) |  _  | |_| |  _  | |_| |
/_/\_\____/ \___|_.__/ \__,_|\__, | |____/  (_)  \___/  (_)  \___/
                             |___/
"""

XDebug 在昨日正式發佈 3.0.0
XDebug 是身為 PHPer 必用的一個套件，可以在程式碼中設定斷點，中斷程式執行並查看程式執行的數據
但小弟是菜雞工程師，加上 Laravel 的 dd() 實在是太過好用
所以一直都還沒有很深入的去使用過 XDebug（慚愧）

// Laravel 中超級好用的除錯方法
dd();

那麼要如何在 Windows WSL 中使用 XDebug 呢？
本篇文章會閱讀前可能要先服用另一篇部落格文章，在 Windows 中安裝 WSL 2
由於小弟很習慣 Mac 的套件管理 Homebrew
所以此篇文章會以 Linux 版本的 Homebrew 來安裝 PHP 與 Xdebug

安裝 PHP

brew install php

Homebrew 安裝的 PHP，會連 PECL 與 PEAR 都一起安裝好
使用 PECL 安裝 XDebug

pecl install xdebug

安裝好之後呢，可以使用 phpinfo() 來查看是否已經裝好 XDebug

phpinfo();

在 VSCode 中使用 XDebug

想要在 VSCode 中使用 XDebug，需要先安裝 PHP Debug 這個 VSCode 套件

還需要 php.ini 中加上以下這些設定
php.ini 的詳細路徑可以在 phpinfo() 頁面中查看

[XDebug]
; 允許使用 IDE 的互動模式檢查程式碼與數據結構
xdebug.mode = debug

; xdebug.remote_autostart 在 3.0.0 已被移除
; 設定 yes 可以在發出一個請求時就自動啟動 XDebug 並中斷程式執行 
xdebug.start_with_request = yes

更改 php.ini 之後，需要重新載入 php 或是 php-fpm

開啟需要除錯的專案，點擊左方 VSCode 的除錯功能，並建立 launch.json 檔案

環境選擇 PHP

此時 VSCode 會在專案底下建立一個 .vscode/launch.json
因為 XDebug 3.0.0 預設 port 改成 9003，所以 port 設定需要從預設的 9000 需要改成 9003

{
    // 使用 IntelliSense 以得知可用的屬性。
    // 暫留以檢視現有屬性的描述。
    // 如需詳細資訊，請瀏覽: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Listen for XDebug",
            "type": "php",
            "request": "launch",
            // XDebug 3.0.0 預設 port 改成 9003
            "port": 9003
        },
        {
            "name": "Launch currently open script",
            "type": "php",
            "request": "launch",
            "program": "${file}",
            "cwd": "${fileDirname}",
            // XDebug 3.0.0 預設 port 改成 9003
            "port": 9003
        }
    ]
}

前置設定好，就可以開始使用 XDebug 的除錯功能
在你想要中斷的地方，設置中斷點
然後開始執行 Debug 功能

然後重新整理網頁，你會發現程式在中斷點這一行停止執行，並顯示除錯的相關資訊

參考資料
Upgrading from Xdebug 2 to 3