1、下載安裝Visual Studio Code

官網(wǎng)地址：https://code.visualstudio.com/
點(diǎn)擊下載鏈接進(jìn)行下載及安裝。
ps：Visual Studio Code擺脫了vs系列開發(fā)工具臃腫的特點(diǎn)，算是一款輕量級跨平臺的良心作品。

2、下載安裝XAMPP

XAMPP是一個功能強(qiáng)大的建站集成軟件包，安裝后即直接集成了Apache+MySQL+PHP+PERL等環(huán)境。
官網(wǎng)地址：https://www.apachefriends.org/zh_cn/download.html
建議選擇7.2.3版本，特別注意，沒有特殊需要不要選擇虛擬機(jī)版本“XAMPP-VM”，否則拷貝文件特別費(fèi)勁。
XAMPP使用可以參考XAMPP使用介紹 ，實(shí)際上安裝后有可視化操作界面，打開玩一玩就知道如何使用了。

3、下載安裝xdebug

官網(wǎng)地址：https://xdebug.org/docs/install
注：一些低版本的XAMPP自帶xdebug，但是我驗(yàn)證7.x的版本沒有帶該功能，所以需要下載。
官網(wǎng)介紹了多種下載安裝方式，需要注意選擇合適的版本安裝，否則會有兼容性問題。
這里采用brew進(jìn)行安裝。
因?yàn)槲覀兺ㄟ^XAMPP工具包安裝的php版本為7.2.3，所以我們這里也要選擇下載對應(yīng)7.2.3版本的xdebug。
我們可以用如下命令先搜索xdebug版本。
brew search xdebug。注：沒有安裝brew要先安裝brew，安裝brew

image.png

4、配置php.ini文件

打開/Applications/XAMPP/xamppfiles/etc/php.ini文件，并在末尾添加如下代碼

[xdebug]
zend_extension=/usr/local/Cellar/php72-xdebug/2.6.0/xdebug.so
xdebug.remote_enable=on
xdebug.remote_handler=dbgp
xdebug.remote_host=127.0.0.1
xdebug.remote_port=9000
xdebug.remote_autostart=1

搜索zend_extension=opcache.so，確認(rèn)它是被注釋的，如：“;zend_extension=opcache.so”
使用XAMPP重啟web server服務(wù)。
打開http://localhost/dashboard/phpinfo.php，頁面搜索xdebug，會查到如下結(jié)果，表明xdebug安裝配置成功。

image.png

5、配置vs code的php開發(fā)相關(guān)環(huán)境

5.1、安裝php debug插件。如下圖所示，在界面搜索php debug并安裝，安裝之后按提示點(diǎn)擊“重新加載”按鈕。

image.png

配置PHP安裝路徑

image.png

配置XDebug調(diào)試
點(diǎn)擊調(diào)試按鈕，默認(rèn)會有一個php環(huán)境的提示，選擇會自動生成如下配置信息

{
            "name": "Listen for XDebug",
            "type": "php",
            "request": "launch",
            "port": 9000
        }

如果因?yàn)轫?xiàng)目路徑問題沒有自動生成，可以直接拷貝。

image.png

新建一個php文件，編輯并保存到/Applications/XAMPP/xamppfiles/htdocs/test.php。
將/Applications/XAMPP/xamppfiles/htdocs拖入vs code中，并在test.php中增加斷點(diǎn)，點(diǎn)擊調(diào)試按鈕，并在瀏覽器中打開http://localhost/test.php,可以看到vs code中已經(jīng)能斷點(diǎn)調(diào)試了。為什么一定要拖入一個文件夾？因?yàn)関s code要求必須是文件夾才能調(diào)試。。

image.png

路徑配置

https://blog.csdn.net/Jioho_chen/article/details/81737864