MapboxGL with Webpack： "ReferenceError: e is not defined" (在 vue-cli 应用程序中)

Question

我正在使用webpack模板开发一个vue-cli 2.9.3应用程序。我有一个使用 MapboxGL 的组件，使用import mapboxgl from 'mapbox-gl;'导入。

在使用npm run dev的开发中一切正常。

我可以在没有问题的情况下构建项目npm run build.但是，使用 MapboxGL 导航到组件时，我在控制台上收到以下错误：

ReferenceError: e is not defined

来自Firefox或Chrome的DevTools无法链接到源映射(.js.map(文件，因此错误消息不是很有帮助。

我能够在./config/index.js中使用devtool: eval-source-map而不是devtool: source-map来使捆绑包工作，但捆绑包大小变为 8Mb>这是不可接受的，也不建议在生产中使用。

我也尝试过没有源映射，但我得到了同样的神秘错误。

如何在打包捆绑包中调试此错误？我希望至少能够看到错误来自哪里。

Answer 1

这似乎是MapboxGL和Webpack的一个已知错误。

可以通过在./build/webpack.prod.conf.js中添加以下内容来解决：

module: {
...
noParse: /(mapbox-gl).js$/,
...
}