VScode+Live Service+Five Service实现php实时调试
一、VScode插件安装及配置
1.Code Runner
settings.json设置(打开方式:ctrl+p,搜索settings.json)
设置php为绝对路径(注意路径分隔符为\\或/)
2. Live Server
settings.json设置:
"liveServer.settings.host": "127.0.0.1",
"liveServer.settings.CustomBrowser": "chrome",
"liveServer.settings.donotShowInfoMsg": true,
"liveServer.settings.port": 5500,
"liveServer.settings.ChromeDebuggingAttachment": false,
3. Live Server(Five server)
settings.json设置:
"fiveServer.host": "127.0.0.1",
"fiveServer.php.executable": "D:\\phpstudy_pro\\Extensions\\php\\php7.4.3nts\\php.exe",
"fiveServer.ignore": [],
fiveServer.php.executable
设置为php绝对路径
4.Open PHP/HTML/JS In Browser
settings.json设置:
"open-php-html-js-in-browser.documentRootFolder": "D:/phpstudy_pro/WWW",
"open-php-html-js-in-browser.selectedBrowser": "Chrome",
"open-php-html-js-in-browser.urlToOpen": "custom",
"open-php-html-js-in-browser.customUrlToOpen": "http://${relativeDirnameDocumentRoot}/${fileBasename}",
使用Open PHP/HTML/JS In Browser右键在浏览器中打开路径不对则需要修改open-php-html-js-in-browser.customUrlToOpen
注意,如果常用浏览器不是Chrome,则需要将上述浏览器配置改为对应的浏览器
二、Chrome浏览器插件安装及配置
1.插件下载
打开Chrome浏览器扩展设置中的开发者模式
进入Chrome插件应用商店下载 Live Server Web Extension
无法进入Chrome插件应用商店,可用该网盘链接:
百度网盘:
链接:https://pan.baidu.com/s/1-7zWuq_MNV8NoPUZgHpZug?pwd=gwcu
夸克网盘:
链接:https://pan.quark.cn/s/b3e2ba83309a
下载到电脑后选择加载已解压的扩展程序
2.插件配置
其中Actual Server Address是正在进行项目的自定义网址,如test.cc
Live Server Address是VScode Live Service插件定义的ip和端口
三、实现php实时调试
开启两个Go Live
浏览器插件为打开状态
对php文件右键使用Open PHP/HTML/JS In Browser打开
实现实时调试