Gatsby v4: compiles with gatsby build; but has Webpack error for gatsby develop

[ajmalafif]

When I ran gatsby develop or gatsby develop --inspect I got these error messages:

 ERROR

(node:24426) [DEP_WEBPACK_MAIN_TEMPLATE_OUTPUT_OPTIONS] DeprecationWarning: MainTemplate.outputOptions is deprecated
(use Compilation.outputOptions instead)
(Use `node --trace-deprecation ...` to show where the warning was created)


 ERROR

(node:24426) [DEP_WEBPACK_MAIN_TEMPLATE_REQUIRE] DeprecationWarning: MainTemplate.hooks.require is deprecated (use
JavascriptModulesPlugin.getCompilationHooks().renderRequire instead)


 ERROR

(node:24426) [DEP_WEBPACK_COMPILATION_NORMAL_MODULE_LOADER_HOOK] DeprecationWarning:
Compilation.hooks.normalModuleLoader was moved to NormalModule.getCompilationHooks(compilation).loader


 ERROR #98124  WEBPACK

Generating development JavaScript bundle failed

undefined

If you're trying to use a package make sure that 'undefined' is installed. If you're trying to use a local file make
sure that the path is correct.


 ERROR #98124  WEBPACK

Generating development JavaScript bundle failed

undefined

If you're trying to use a package make sure that 'undefined' is installed. If you're trying to use a local file make
sure that the path is correct.


 ERROR #98124  WEBPACK

Generating development JavaScript bundle failed

undefined

If you're trying to use a package make sure that 'undefined' is installed. If you're trying to use a local file make
sure that the path is correct.


 ERROR #98124  WEBPACK

Generating development JavaScript bundle failed

undefined

If you're trying to use a package make sure that 'undefined' is installed. If you're trying to use a local file make
sure that the path is correct.


 ERROR #98124  WEBPACK

Generating development JavaScript bundle failed

undefined

If you're trying to use a package make sure that 'undefined' is installed. If you're trying to use a local file make
sure that the path is correct.


 ERROR #98124  WEBPACK

Generating development JavaScript bundle failed

undefined

If you're trying to use a package make sure that 'undefined' is installed. If you're trying to use a local file make
sure that the path is correct.

failed Building development bundle - 4.092s
ERROR in commons
Module not found: TypeError: Cannot read property 'indexOf' of undefined

ERROR in commons
Module not found: TypeError: Cannot read property 'indexOf' of undefined

ERROR in commons
Module not found: TypeError: Cannot read property 'indexOf' of undefined

ERROR in polyfill
Module not found: TypeError: Cannot read property 'indexOf' of undefined

ERROR in polyfill
Module not found: TypeError: Cannot read property 'indexOf' of undefined

ERROR in polyfill
Module not found: TypeError: Cannot read property 'indexOf' of undefined

develop compiled with 6 errors
success Writing page-data.json files to public directory - 0.057s - 3/38 671.66/s

but works fine when I ran gatsby build ; gatsby serve: https://6180091216e7ab0007ac71ce--ajmalafif.netlify.app/

Here is my repo if it helps: https://github.com/ajmalafif/ajmalafif.com/tree/v4

[ajmalafif]

npm i -D webpack@latest --legacy-peer-deps

[chicio]

Hi @ajmalafif, did you understand why this is needed now? 🤔

[ajmalafif]

no idea but it worked for me!

[mcclaskiem]

I am getting the same issue and tried this but it is still not working, do I need to run npm rebuild

[iamamitshrma]

I'm getting this error in my Gatsby project and I have updated the version of Gatsby from 2 to 5 and also all other packages. Can anyone help me?
Also Building development bundle is running continuously.

I also tried this "npm i -D webpack@latest --legacy-peer-deps"

[selfboot]

same question