开发者问题收集

无法设置未定义或空引用的属性“wrap”

2020-10-28
2070

我正在使用 webpack + babel 为浏览器构建一个包,将其定位到 ES5。当我尝试使用它时,出现错误 无法设置未定义或空引用的属性“wrap” 。当我在不使用 babel 的情况下构建包时,它工作正常,所以我使用的配置/插件可能有问题

webpack.config.js

module.exports = {
    entry: ['./index.js'],
    module: {
        rules: [{
            // Only run `.js` files through Babel
            test: /\.js$/,
            use: {
                loader: 'babel-loader',
                options: {
                    presets: ["@babel/preset-env"],
                    plugins: [
                        [
                            '@babel/plugin-proposal-decorators',
                            {
                                legacy: true,
                            },
                        ],
                        '@babel/plugin-proposal-class-properties',
                        [
                            '@babel/plugin-transform-runtime',
                            {
                                regenerator: true,
                            },
                        ],
                    ],
                }
            }
        }]
    },
    resolve: {
        modules: ['./node_modules']
    },
    optimization: {
        minimize: false
    },
    output: {
        filename: 'test.bundle.js',
        library: 'test',
    },
    node: {
        tls: "empty",
        fs: "empty",
        net: "empty"
    }
};

依赖项:

...
"devDependencies": {
    "@babel/core": "^7.12.3",
    "@babel/plugin-proposal-class-properties": "^7.12.1",
    "@babel/plugin-proposal-decorators": "^7.12.1",
    "@babel/plugin-transform-runtime": "^7.12.1",
    "@babel/preset-env": "^7.12.1",
    "acorn": "^8.0.4",
    "babel-loader": "^8.1.0",
    "babel-polyfill": "^6.26.0",
    "uglifyjs-webpack-plugin": "^2.2.0",
    "webpack": "^4.44.2",
    "webpack-cli": "^3.3.12"
  },
...

堆栈跟踪

Uncaught TypeError: Cannot set property 'wrap' of undefined
    at test.bundle.js:6818
    at Module.<anonymous> (schemarama.bundle.js:7472)
    at Module.<anonymous> (schemarama.bundle.js:7492)
    at __webpack_require__ (schemarama.bundle.js:21)
    at Object.<anonymous> (schemarama.bundle.js:237)
    at __webpack_require__ (schemarama.bundle.js:21)
    at Module.<anonymous> (schemarama.bundle.js:6509)
    at Module.<anonymous> (schemarama.bundle.js:6758)
    at __webpack_require__ (schemarama.bundle.js:21)
    at Object.<anonymous> (schemarama.bundle.js:6496)

包中导致错误的位置(最后一行)+ wrap 定义

var runtime = function (exports) {
  "use strict";

  var Op = Object.prototype;
  var hasOwn = Op.hasOwnProperty;
  var undefined; // More compressible than void 0.

  var $Symbol = typeof Symbol === "function" ? Symbol : {};
  var iteratorSymbol = $Symbol.iterator || "@@iterator";
  var asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator";
  var toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag";

  function define(obj, key, value) {
    Object.defineProperty(obj, key, {
      value: value,
      enumerable: true,
      configurable: true,
      writable: true
    });
    return obj[key];
  }

  try {
    // IE 8 has a broken Object.defineProperty that only works on DOM objects.
    define({}, "");
  } catch (err) {
    define = function define(obj, key, value) {
      return obj[key] = value;
    };
  }

  function wrap(innerFn, outerFn, self, tryLocsList) {
    // If outerFn provided and outerFn.prototype is a Generator, then outerFn.prototype instanceof Generator.
    var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator;
    var generator = Object.create(protoGenerator.prototype);
    var context = new Context(tryLocsList || []); // The ._invoke method unifies the implementations of the .next,
    // .throw, and .return methods.

    generator._invoke = makeInvokeMethod(innerFn, self, context);
    return generator;
  }

  exports.wrap = wrap; 

提前感谢您的帮助 :)

2个回答

显然这是一个过时的问题,但问题仍然存在。

我不知道为什么,但这个错误源自插件“@babel/plugin-transform-runtime”

要解决此问题,您必须关闭帮助程序:

[
  '@babel/plugin-transform-runtime',
    {
      helpers: false,
      regenerator: true
    }
]

不打开帮助程序会占用更多空间,但在我找到可行的解决方案(或获取错误报告)之前,这是迄今为止解决问题的最佳方法。另一种方法是内联 polyfill 和运行时生成器:

import "regenerator-runtime/runtime"; // this is equivalent to @babel/plugin-transform-runtime
import "core-js/stable"; // if polyfills are also needed

您可以将它们放在应用程序/库的入口处,但它会占用更多内存,而对我来说,删除帮助程序只会增加几 kB。

Craig O'Connor
2021-11-09

我最近遇到了同样的问题,所以我留下这个答案,这对任何在网上搜索的人来说都很有用。 修复这个问题真的很简单,只要你不从 webpack babel-loader 选项中排除 node_module 目录,就会抛出这种错误。只需添加排除选项:

              {
                  loader: 'babel-loader',
                  options: {
                     presets: ['@babel/preset-env'],
                     plugins: [
                        '@babel/plugin-transform-runtime',
                     ],
                     exclude: [/node_modules/],//this is what removes the error
                  },
               },
KeyvanKh
2022-04-27