Question

我正在处理的项目的端口6379上有Redis，端口5000上有节点服务器。我通过运行npm run server运行服务器我的package.json脚本如下：

webpack --watch --progress --config ./build/server/webpack.dev.js

在端口5000上为Attach to Node.js/Chrome添加配置并单击WebStorm中的错误图标时，我无法附加调试器。

我得到invalid response from the remote host

我应该为我的程序包JSON脚本修补--inspect选项吗？

编辑：我将检查传递给了nodemon。我现在可以附加到调试器，但是断点一直挂起。 Webpack的配置如下：

const commonWebpackConfig = require('./webpack.common')
const merge = require('webpack-merge')
const NodemonPlugin = require('nodemon-webpack-plugin')

module.exports = merge(commonWebpackConfig, {
  mode: 'development',
  plugins: [
    new NodemonPlugin({
        nodeArgs: [ '--inspect'],
        script: './dist/server.js'
    })
  ]
})


const path = require('path')
const webpack = require('webpack')
const nodeExternals = require('webpack-node-externals')

module.exports = {
  entry: {
    server: path.join(__dirname, '..', '..', 'server', 'app.js'),
  },
  output: {
    path: path.join(__dirname, '..', '..', 'dist'),
    publicPath: '/',
    filename: '[name].js'
  },
  target: 'node',
  node: {
    __dirname: false,
    __filename: false,
  },
  externals: [nodeExternals()],
  resolve: {
    extensions: ['.js']
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader',
          options: {
            presets: ['@babel/preset-env'],
            plugins: [
              ['@babel/plugin-proposal-class-properties', {'loose': false}]
            ]
          }
        }
      }
    ]
  }
}

我发现了断点映射问题。我需要添加以下内容：

devtool: "eval-source-map",

编辑：

我认为断点不能完全用于具有异步/等待功能的代码块

Answer 1

我能够使它正常工作。我们使用的是nodemon-webpack-plugin，所以我需要像Lena所说的那样传入nodeArgs。我通过了--inspect，默认情况下它是端口9229。

然后我必须添加devtools: "eval-source-map，以便我的断点具有正确的映射。

编辑：

我认为断点不能完全用于具有异步/等待功能的代码块

如何为Webpack捆绑的服务器设置断点

1 个答案: