Razzle: 使用 vscode 调试节点服务器

通过进程ID附加我很幸运。 还有一个sourceMaps vscode 启动配置选项，您可以将其设置为 true。

    {
      "type": "node",
      "request": "attach",
      "name": "Attach by Process ID",
      "processId": "${command:PickProcess}",
      "restart": true
    }

@ajsharp感谢您的回复 :smiley_cat:

与附加方法相同。 我无法在 src/index.js 中设置断点。

sourceMaps 选项默认为 true（参见 https://code.visualstudio.com/docs/nodejs/nodejs-debugging#_source-maps）

我使用不同的源映射设置解决了这个问题，VSCode 似乎不喜欢cheap-module-sourcemap之一。
razzle.config.js ：

module.exports = {
    modify(config, { target, dev }, webpack) {
        config.devtool = dev ? 'eval-source-map' : 'none';
        return config;
    }
}

launch.json ：

{
    "name": "Attach to dev server",
    "type": "node",
    "request": "attach",
    "protocol": "inspector",
    "address": "localhost",
    "port": 9230
}

并使用yarn start --inspect --inspect-port 9230启动服务器

*已编辑，感谢@dguyonvarch发现错误。

@benhamlin :smile_cat: 效果很好！
我刚刚修复了您的代码段：

module.exports = {
  modify: (config, { target, dev }, webpack) => {
      config.devtool = dev ? 'eval-source-map' : 'none';
      return config
  }
}

我在razzle/packages/razzle/config/createConfig.js第 93 行找到了这个：

// Controversially, decide on sourcemaps.
devtool: 'cheap-module-source-map'

所以我打开了争议 :wink: ！ 为什么是cheap-module-source-map而不是eval-source-map

有人想在文档中添加一个关于这个食谱的部分吗？

@jaredpalmer我可以用eval-source-map提出合并请求吗？ 在这种情况下无需更新文档。

你好！ 所以这就是开源与我的日常工作和生活之间的交易，我有很多事情要管理，所以我使用 GitHub 机器人在这里和那里自动化一些事情。 这个特定的 GitHub 机器人将把它标记为陈旧，因为它有一段时间没有最近的活动。 如果几天内没有进一步的活动，它将关闭。 不要把这当成个人 - 说真的 - 这是一个完全自动化的操作。 如果这是一个错误，请发表评论、私信我、发送航母 pidgeon 或烟雾信号。

ProBot 由于不活动而自动关闭它。 如果这是一个错误，请大声喊叫，我们将重新打开它。

更新：让 vscode 调试服务器的更好方法是将其添加到您的 launch.json，并将 devtool 配置保留为 razzle 的默认值。

这将允许 VSCode 调试，以及更好的客户端调试体验（eval-source-maps 破坏了 React 的调试错误查看器）。

"sourceMapPathOverrides": {
    "webpack:///*": "${workspaceRoot}/*"
 }

谢谢@benhamlin。 在 Razzle 中进行软重启（ rs然后ENTER ）之后，您是否可以轻松地重新连接到 VSCode 中的调试器实例？

ATM 如果我进行软重启，VSCode 调试器会断开连接，所以我必须终止服务器并重新启动它，然后重新连接调试器。

@benhamlin这个配置就像一个魅力：wink：

{
      "type": "node",
      "request": "attach",
      "name": "Attach",
      "port": 9230,
      "sourceMapPathOverrides": {
         "webpack:///*": "${workspaceRoot}/*"
      }
}

@ourmaninamsterdam RS 在新的调试端口 (9230 + 1) 上重新启动服务器，因此您必须在启动配置中更改附加端口。 我没有进一步调查：失望：