## 安装VSCode的 PHP Debug 扩展 打开扩展管理,搜索 `PHP Debug`,然后安装 ![imageb5585c4bc3df2f90.png](https://attachment.wampserver.site/images/2021/06/15/imageb5585c4bc3df2f90.png) 首次使用需要添加配置 ![image259252c980621c0e.png](https://attachment.wampserver.site/images/2021/06/15/image259252c980621c0e.png) 记录下配置里的这个端口,一会要用 ![imagebf6c09a34cedf3ba.png](https://attachment.wampserver.site/images/2021/06/15/imagebf6c09a34cedf3ba.png) 扩展安装完成 ## 安装浏览器的 Xdebug helper 扩展 为了方便配置调试,需要安装专门浏览器扩展。 浏览器扩展下载: * [Xdebug Helper for Firefox](https://addons.mozilla.org/en-GB/firefox/addon/xdebug-helper-for-firefox/) * [Xdebug helper - Chrome 网上应用店 (google.com)](https://chrome.google.com/webstore/detail/xdebug-helper/eadndfjplgieldjbigjakmdgkmoaaaoc) * [‎XDebugToggle on the Mac App Store (apple.com)](https://apps.apple.com/app/safari-xdebug-toggle/id1437227804?mt=12) * [Xdebug helper - Microsoft Edge Addons](https://microsoftedge.microsoft.com/addons/detail/xdebug-helper/ggnngifabofaddiejjeagbaebkejomen?hl=zh-CN) 然后启用 `Debug` 模式 ![imagebaa89bc967a23e78.png](https://attachment.wampserver.site/images/2021/06/15/imagebaa89bc967a23e78.png) ## 调整 PHP 的 Xdebug 配置 打开编辑 PHP 配置文件,修改以下配置(没有的配置则直接新增) > `9003` 端口要跟 `PHP Debug 扩展` 里的端口一样 ``` xdebug.mode = develop,debug xdebug.client_port = 9003 xdebug.client_host = localhost xdebug.start_with_request = yes ``` ## 测试在 VSCode 里面使用 ![f52edcedaaf34666cb00ae6c38a5208b.gif](https://attachment.wampserver.site/images/2021/06/16/f52edcedaaf34666cb00ae6c38a5208b.gif)