webpack 和 babel 构建中的 node_modules 中的 console.log 的 Sourcemaps 中断

pst*_*trm 5 javascript source-maps webpack babeljs

我正在尝试为我的 Babel 7.7 和 Webpack 4.41 构建代码启用源映射。

除了源自 node_modules 中代码的控制台语句外,源映射工作正常。这些声明主要是开发提示,当我们做错事时发出警告。对于我们自己的源代码中的控制台语句,源映射可以工作,如果第 3 方库中发生错误,它们也可以工作。

当依赖项 console.logs 时,跟踪如下所示:

Warning: a promise was rejected with a non-error: [object String]
    at eval (webpack-internal:///./src/app/bootstrap/bootstrap.js:66:13)
From previous event:
    at _callee$ (webpack-internal:///./src/app/bootstrap/bootstrap.js:65:140)
    at tryCatch (webpack-internal:///../node_modules/regenerator-runtime/runtime.js:45:40)
    at Generator.invoke [as _invoke] (webpack-internal:///../node_modules/regenerator-runtime/runtime.js:271:22)
    at Generator.prototype.<computed> [as next] (webpack-internal:///../node_modules/regenerator-runtime/runtime.js:97:21)
Run Code Online (Sandbox Code Playgroud)

在浏览器中检查 bootstrap.js 时,我没有完全获得构建代码,仍然应用了源映射,但我也没有获得 babel 的输出,甚至没有获得原始代码。这是介于两者之间的某种状态。

我创建了一个简单的存储库,在其中重现问题,尝试以受控方式解决它: https: //github.com/pstenstrm/webpack-sourcemap-test

Object(react_loadable__WEBPACK_IMPORTED_MODULE_9__["preloadReady"])().then(function _callee() {
  return _Users_path_to_proj_node_modules_babel_runtime_corejs3_regenerator__WEBPACK_IMPORTED_MODULE_0___default.a.async(function _callee$(_context) {
    while (1) {
      switch (_context.prev = _context.next) {
        case 0:
          _context.next = 2;
          return _Users_path_to_proj_node_modules_babel_runtime_corejs3_regenerator__WEBPACK_IMPORTED_MODULE_0___default.a.awrap(new bluebird__WEBPACK_IMPORTED_MODULE_1___default.a(function (a, reject) {
            reject('asdas');
          }));
Run Code Online (Sandbox Code Playgroud)

我的 babel 配置如下所示:

{
    "presets": [
        [
            "@babel/preset-env",
            {
                targets: {
                    browsers: "last 2 versions"
                }
            }
        ]
    ],
    "plugins": [
        [
            "@babel/plugin-transform-runtime",
            {
                "corejs": 3,
                "proposals": true,
                "absoluteRuntime": true
            }
        ]
    ]
}
Run Code Online (Sandbox Code Playgroud)

在 webpack 中,设置如下所示:

const path = require('path');

module.exports = {
    entry: ['./src/index.js'],
    mode: 'development',
    devtool: 'eval-source-map',
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'bundle.js'
    },
    module: {
        rules: [{
            test: /\.js$/,
            exclude: [/node_modules/],
            use: 'babel-loader?sourceMap&cacheDirectory'
        }]
    },
};
Run Code Online (Sandbox Code Playgroud)

我已经测试了https://webpack.js.org/configuration/devtool/的所有选项,而某些选项使其变得稍微更糟,没有选项使其变得更好。

我也尝试配置SourceMapDevToolPluginEvalSourceMapDevToolPlugin解决该问题,但仍然没有任何改进。我可能会遗漏一些东西,但我不知道它可能是什么。

这是预期的吗?node_modules 中的console.log 是否根本不受支持,或者是否有我缺少的设置?