如何在 WebStorm 中调试 React Express Webpack 应用程序
How to debug React Express Webpack app in WebStorm
我正在尝试调试 react - express 应用程序的后端。我正在使用 webpack 进行捆绑。
如何在WebStorm上编辑配置，以便我可以同时调试前端和后端？我正在使用 WebStorm 2016。
您需要创建并启动 Node.js run/debug 配置来调试您的 server-side 代码，并为 [=22= 创建并启动 JavaScript 调试配置]代码。
在 Node.js 配置的 JavaScript 文件字段中，您需要指定启动服务器的文件路径。
在 JavaScript 配置的 URL 字段中指定 URL 您的服务器 运行 上。您可能还需要配置本地路径和远程 URLs 之间的映射：这很可能应该在组件所在的文件夹和 webpack:/// 之间。 （有关详细信息，请参阅此 answer）。
还要确保您的 Webpack 配置中有 dev-tools: 'source-map'。
浏览了 WebStrom 上的一些文档并最终设法让它工作。首先 select 编辑配置 然后会弹出一个菜单，允许您编辑 Run/Debug 配置 。点击左侧的+按钮，添加一个节点js。将 Node interpreter 从 default(local) node_modules 更改为项目依赖项中的 babel 节点。例如~/MyWork/Project/node_modules/.bin/babel-node。然后添加--presets=babel-preset-es2015作为节点参数。填写其余配置并单击保存和 运行 项目。
这是一个例子：
我正在尝试调试 react - express 应用程序的后端。我正在使用 webpack 进行捆绑。
如何在WebStorm上编辑配置，以便我可以同时调试前端和后端？我正在使用 WebStorm 2016。
您需要创建并启动 Node.js run/debug 配置来调试您的 server-side 代码，并为 [=22= 创建并启动 JavaScript 调试配置]代码。
在 Node.js 配置的 JavaScript 文件字段中，您需要指定启动服务器的文件路径。
在 JavaScript 配置的 URL 字段中指定 URL 您的服务器 运行 上。您可能还需要配置本地路径和远程 URLs 之间的映射：这很可能应该在组件所在的文件夹和 webpack:/// 之间。 （有关详细信息，请参阅此 answer）。
还要确保您的 Webpack 配置中有 dev-tools: 'source-map'。
浏览了 WebStrom 上的一些文档并最终设法让它工作。首先 select 编辑配置 然后会弹出一个菜单，允许您编辑 Run/Debug 配置 。点击左侧的+按钮，添加一个节点js。将 Node interpreter 从 default(local) node_modules 更改为项目依赖项中的 babel 节点。例如~/MyWork/Project/node_modules/.bin/babel-node。然后添加--presets=babel-preset-es2015作为节点参数。填写其余配置并单击保存和 运行 项目。
这是一个例子：