我尝试使用VSCode的调试“功能”来调试一个React应用程序。到目前为止,通过快速的网络搜索,我发现许多资源声称可以使用VSCode的Chrome调试器进行操作,例如:
- https://hackernoon.com/debugging-react-like-a-champ-with-vscode-66281760037
- https://medium.com/@auchenberg/live-edit-and-debug-your-react-apps-directly-from-vs-code-without-leaving-the-editor-3da489ed905f
但是我找不到使用Firefox这样做的方法。到目前为止,我已经在VSCode上安装了“Firefox调试器”,并设置了以下调试选项:
{
"version": "0.2.0",
"configurations": [
{
"name": "Debug app",
"type": "firefox",
"request": "attach"
}
]
}
我按照文档所述运行:
firefox -start-debugger-server -no-remote
我尝试在VSCode上初始化调试过程,但是出现了以下错误:
connect 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应用上,通过npm start
命令在Firefox浏览器上使用VSCode的调试功能。
编辑 1
出现以下错误,显示firefox实例未运行:
[Parent 13358, Gecko_IOThread] WARNING: pipe error (173): Η σύνδεση έκλεισε από το ταίρι: file /build/firefox-JSAO4L/firefox-57.0.3+build1/ipc/chromium/src/chrome/common/ipc_channel_posix.cc, line 353
你有任何想法为什么Firefox关闭了调试器吗?
about:debugging#/setup
在我的 Firefox 实例上启用调试器,才能连接到我的 React 应用程序并捕获断点。 - rrriki