当关注标题为 "Debugging React apps created with Create React App in WebStorm" 的文章时，调试器显示它已连接到 JetBrains IDE Chrome 扩展，但在使用端口 3000 时无法获得要执行的断点，并且当我尝试使用默认调试端口 63342 时，会显示 404 错误。
<小时/>以下是我尝试调试时在 Chrome 和 Webstorm 2016.2 IDE 中的设置记录:http://recordit.co/MQ3LICuUIc
<小时/>采取的步骤:
我创建了一个名为“ERS React Debug”的新 JS 调试配置，浏览器设置为 Chrome，并且我尝试在配置中使用以下 URL:
http://localhost:3000/ers_react/public/index.html
http://localhost:63342/ers_react/public/index.html
(我观看的 YT 视频使用了调试端口，这就是我录制的内容)
我还按照文章中的建议设置了到 webpack:///src 的映射。
最佳答案
使用create-react-app创建的默认ReactJS应用程序设计为托管在使用react-scripts start启动的webpack服务器上，该服务器构建应用程序并启动服务器。您将无法在简单的内置网络服务器 (localhost:63342) 上打开此应用程序。
为了能够调试现代 React 应用程序，您需要将 Webstorm 升级到最新版本 - 调试将开箱即用。对于 Webstorm 2016.2，您可以尝试指定 URL 映射...对于 "react-scripts": "1.0.17"，它应该是 http://localhost:3000/static/js/full/项目路径，如 http://localhost:3000/static/js/C:/WebstormProjects/untitled 如果项目路径为 C:/WebstormProjects/无标题 应该可以:
请注意，您需要刷新浏览器页面才能在 pagfe 加载命中时执行的代码中获取断点
关于javascript - 尝试为 create-react-app 设置 WebStorm IDE JavaScript 调试器时出现 404 错误，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/51661559/