我尝试使用VSCode的调试“功能”调试react应用程序,到目前为止,通过快速Web搜索,我发现很多资源声称如何使用VSCode的Crome调试器来实现这一点,如:
但我找不到用firefox做的方法。到目前为止,我在VSCode上安装了“Debugger for firefox”,我提出了以下调试选项:
{
"version": "0.2.0",
"configurations": [
{
"name": "Debug app",
"type": "firefox",
"request": "attach"
}
]
}
我按照文档说明运行:
firefox -start-debugger-server -no-remote
我尝试通过VSCode初始化调试过程,当我这样做时,我得到错误:
连接ECONNREFUSED 127.0.0.1:6000
可以通过运行以下命令的GNU / Linux机器确认该错误
netstat -ntlp
(Not all processes could be identified, non-owned process info
will not be shown, you would have to be root to see it all.)
Active Internet connections (only servers)
Proto Recv-Q Send-Q Local Address Foreign Address State PID/Program name
tcp 0 0 127.0.0.1:37893 0.0.0.0:* LISTEN 9368/node
tcp 0 0 0.0.0.0:27017 0.0.0.0:* LISTEN -
tcp 0 0 0.0.0.0:139 0.0.0.0:* LISTEN -
tcp 0 0 127.0.0.1:6379 0.0.0.0:* LISTEN -
tcp 0 0 127.0.0.1:9333 0.0.0.0:* LISTEN 10924/code
tcp 0 0 127.0.1.1:53 0.0.0.0:* LISTEN -
tcp 0 0 10.42.0.1:53 0.0.0.0:* LISTEN -
tcp 0 0 127.0.0.1:631 0.0.0.0:* LISTEN -
tcp 0 0 0.0.0.0:3000 0.0.0.0:* LISTEN 6732/node
tcp 0 0 127.0.0.1:3001 0.0.0.0:* LISTEN 6784/mongod
tcp 0 0 0.0.0.0:3002 0.0.0.0:* LISTEN 11168/node
tcp 0 0 0.0.0.0:445 0.0.0.0:* LISTEN -
tcp 0 0 0.0.0.0:20256 0.0.0.0:* LISTEN 9368/node
tcp6 0 0 :::9090 :::* LISTEN 11340/node
tcp6 0 0 :::139 :::* LISTEN -
tcp6 0 0 ::1:631 :::* LISTEN -
tcp6 0 0 :::445 :::* LISTEN -
所以我问如何在使用react-create-app
创建的React应用程序上使用VSCode的调试功能并使用firefox运行npm start
命令?
由于某些原因,当前运行的firefox实例出现错误:
[Parent 13358,Gecko_IOThread]警告:管道错误(173):Ησύνδεσηέκλεισεαπότοταίρι:file /build/firefox-JSAO4L/firefox-57.0.3+build1/ipc/chromium/src/chrome/common/ ipc_channel_posix.cc,第353行
你知道为什么firefgox会关闭调试器吗?
答案 0 :(得分:6)
上面提到的插件有以下github存储库: https://github.com/hbenl/vscode-firefox-debug
另外,如果您更好地查看文档,它会声明要在firefox上应用以下配置以启用调试:
通过在浏览器的地址栏中输入about:config
,可以应用上述更改。
之后为了调试只需使用vscode上的配置:
{
"version": "0.2.0",
"configurations": [
{
"name": "Debug app",
"type": "firefox",
"request": "attach"
}
]
}
现在,每次要调试应用程序时,只需在终端上运行:
firefox -start-debugger-server -no-remote
在VSCode上选择“Debug”选项并选择图像显示的选项: