javascript - 无法读取未定义的属性 '_babelPolyfill'

Question

我正在尝试让 babel-polyfill 与图书馆一起工作，但我收到以下错误:

TypeError: Cannot read property '_babelPolyfill' of undefined
at Object.<anonymous> (/Users/foo/webpack-library-starter/lib/library.js:73:6)
...

我正在使用 webpack-library-starter作为我的模板。

完整的复制细节:

git clone https://github.com/krasimir/webpack-library-starter.git
cd webpack-library-starter
npm i
npm i --save babel-polyfill

尝试将 import 'babel-polyfill' 添加到“src/index.js”的开头，但没有。

将 'babel-polyfill' 添加到“webpack.config.js”:

  entry: ['babel-polyfill', __dirname + '/src/index.js'],

然后构建和测试:

npm run dev
npm run build
npm test

Answer 1

这个项目模板有点不明智。 Webpack 创建要在浏览器环境中加载的包。然而，Mocha 在节点中运行。因此，您必须考虑变形 webpack 对捆绑代码的作用，以及当此代码反馈到节点时会发生什么。

当 babel-polyfill 被 webpack 捆绑时，有一个隐含的假设，即 bundle 将被加载到浏览器和一些特定的全局变量(即未绑定(bind)的 this functions 指的是 window) 将在那里。

在节点中加载 babel-polyfill 的正确方法是使用节点自己的 require。比如将package.json中的测试脚本改成:

"test": "mocha --compilers js:babel-core/register --colors -r babel-polyfill ./test/*.spec.js"

你的库包根本不应该加载 babel-polyfill。如果你的库初始化了 babel-polyfill 并且有人将你的库包含到他们的项目中也初始化了 babel-polyfill，他们会得到一个异常说明，引用，”只允许一个 babel-polyfill 实例”。