Gatsby 构建错误（可能与 webpack 有关）

Question

我用 gatsby (npm init gatsby) 创建了一个网站，并添加了一些组件，然后工作正常：

我运行 npm rundevelop （在正常运行之后）并得到：

failed Building development bundle - 13.532s
ERROR in ./.cache/app.js
Module build failed (from ./node_modules/@pmmmwh/react-refresh-webpack-plugin/loader/index.js):
Error: You must provide the URL of lib/mappings.wasm by calling SourceMapConsumer.initialize({ 'lib/mappings.wasm': ... }) before using
SourceMapConsumer

ERROR in ./.cache/polyfill-entry.js
Module build failed (from ./node_modules/@pmmmwh/react-refresh-webpack-plugin/loader/index.js):
Error: You must provide the URL of lib/mappings.wasm by calling SourceMapConsumer.initialize({ 'lib/mappings.wasm': ... }) before using
SourceMapConsumer

是什么原因导致此错误以及如何修复此错误？我很困惑。尝试了新的网站并做了同样的事情。

我升级到了最新版本的节点，所以也许这与它有关。有人可以帮忙吗？

Answer 1

我可以确认降级到节点 16 可以解决该问题。

Answer 2

我能够按照此处的说明避免降级到 Node 16： https: //github.com/gatsbyjs/gatsby/issues/35607

我将其添加到我的 package.json 中：

  "resolutions": {
    "source-map": "^0.8.0-beta.0"
  },
  "dependencies": {
    "source-map": "^0.8.0-beta.0",
    ...

然后我就这么做了npm install。

之后我就可以npm run develop毫无问题地运行了。

Answer 3

尝试删除 .cache 文件，然后运行 ​​npm rundevelop