Source map error: Error: Invalid URL 如何解决？答案

【问题标题】：Source map error: Error: Invalid URL how to fix it?Source map error: Error: Invalid URL 如何解决？
【发布时间】：2021-02-04 20:21:01
【问题描述】：

我有使用脉轮 ui 样式的 next.js 应用程序。它的电影应用程序及其从电影数据库中获取图像。当我在图像加载之前打开我的网站时，我只能看到这个 img 的 ulr 文本，然后在 1s 图像 laodes 之后。如何防止这种情况？

我得到了 firefox 的错误信息：

源映射错误：错误：无效 URL：webpack://[name]_[chunkhash]/webpack/bootstrap 资源网址：http://127.0.0.1:3001/_next/static/development/dll/dll_01ec57fc9b90d43b98a8.js?ts=1574263926643 源地图网址：dll_01ec57fc9b90d43b98a8.js.map

【问题讨论】：

【解决方案1】：

我遇到了同样的错误，发现似乎有关于源映射和 Firefox 的错误：

Chrome 没有显示这个问题...

【讨论】：

【解决方案2】：

尝试配置output.devtoolNamespace。

此选项确定与 output.devtoolModuleFilenameTemplate 一起使用的模块命名空间。未指定时，默认值为：output.library。它用于在加载多个使用 webpack 构建的库时防止 sourcemaps 中的源文件路径冲突。

如果你使用firefox调试，你最好配置output.devtoolModuleFilenameTemplate使用http://而不是webpack://。

【讨论】：