webpack和babel构建中的node_modules中console.log的源映射中断

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

除了源于node_modules中代码的控制台语句外,sourcemaps都可以正常工作。这些语句主要是开发人员提示,是对我们做错事的警告。对于我们自己的源代码中的控制台语句,sourcemaps起作用,如果在第三方库中发生错误,它们也起作用。

当依赖项控制台记录日志时,跟踪如下所示:

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)

在浏览器中检查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');
          }));

我的babel配置如下:

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

在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'
        }]
    },};

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

我也尝试配置SourceMapDevToolPluginEvalSourceMapDevToolPlugin来解决该问题,但仍然没有任何改善。我可能会丢失某些东西,但我不知道它可能是什么。

这是所期望的吗?是否仅不支持node_modules中的console.log,还是缺少我的设置?

hjh198966 回答:webpack和babel构建中的node_modules中console.log的源映射中断

暂时没有好的解决方案,如果你有好的解决方案,请发邮件至:iooj@foxmail.com
本文链接:https://www.f2er.com/2907475.html

大家都在问