docker容器中的远程调试节点 - WebStorm中的源映射

Question

我在使用WebStorm（或IntelliJ）远程调试选项调试竞争应用程序时遇到问题，该选项在尝试远程调试本地运行的应用程序时非常有用。

以下是我的gulp配置文件的相关部分：

gulp.task("mainCompile", () =>
    gulp.src(`${config.src.main.baseDir}/**/*.js`, {base: "./src"})
        .pipe(plugins.sourcemaps.init())
        .pipe(plugins.babel())
        .pipe(plugins.sourcemaps.write(".", {
          includeContent: false,
          sourceRoot: "../src"
        }))
        .pipe(gulp.dest(config.build.baseDir))
);

gulp.task("nodemon", ["copyResources", "compile"], () =>
    plugins.nodemon({
      execMap: {
        js: "node --debug-brk"
      },
      script: path.join(config.build.mainDir, "index.js"),
      ext: "js yaml",
      delay: 2500,
      debug: true,
      verbose: true,
      watch: config.src.main.baseDir,
      tasks: ["copyNonJs", "yamlToJson", "compile"]
    })
);

撰写配置的部分。如您所见，我将项目根目录挂载到容器中的/ app。

server:
    image: justmarried/jmserver:development-latest
    build:
      context: .
      dockerfile: containers/develop/Dockerfile
    ports:
      - 2701:2701
      - 5858:5858
    volumes:
      - ./:/app

远程调试器附加但仅停止在index.js中定义的断点（或者如果我将断点放在＆＃34; build＆＃34; dir中，这不是我想要的）。当应用程序完全加载时，我得到了这个：

正如您所看到的，index.js完全映射，但其他文件都没有。尝试将内联代码内嵌到源图中，但它没有帮助。它是WebStorm中的一个错误（最新，2017.1.3）？

再观察一次。当我做＆＃34;显示实际来源＆＃34;调试选项卡中的脚本选项卡中的build dir中的任何文件我得到了......像这样：

(function (exports, require, module, __filename, __dirname) { "use strict";

var _httpStatus = require("http-status");

var _httpStatus2 = _interopRequireDefault(_httpStatus);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

module.exports = {
  get: function get(req, res) {
    res.status(_httpStatus2.default.OK).json({
      text: "Hi there!"
    });
  }
};
//# sourceMappingURL=ping.js.map

});

但是当我这样做时，显示来源＆＃34;我得到了

"use strict";

var _httpStatus = require("http-status");

var _httpStatus2 = _interopRequireDefault(_httpStatus);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

module.exports = {
  get: function get(req, res) {
    res.status(_httpStatus2.default.OK).json({
      text: "Hi there!"
    });
  }
};
//# sourceMappingURL=ping.js.map

当然，该文件的实际来源位于src / main目录而不是build / main目录中，并且是：

import HttpStatus from "http-status";

module.exports = {
  get(req, res) {
    res.status(HttpStatus.OK).json({
      text: "Hi there!"
    });
  }
};

ping.js.map的内容是：

{"version":3,"sources":["main/handlers/ping.js"],"names":["module","exports","get","req","res","status","OK","json","text"],"mappings":";;AAAA;;;;;;AAEAA,OAAOC,OAAP,GAAiB;AACfC,KADe,eACXC,GADW,EACNC,GADM,EACD;AACZA,QAAIC,MAAJ,CAAW,qBAAWC,EAAtB,EAA0BC,IAA1B,CAA+B;AAC7BC,YAAM;AADuB,KAA/B;AAGD;AALc,CAAjB","file":"ping.js","sourceRoot":"../../../src"}