I ran the following commands to create a new gatsby starter blog:

gatsby new blog

cd blog

gatsby develop

But during gatsby develop, I'm getting a lot of errors named ERROR #98123 WEBPACK saying- Generating development JavaScript bundle failed.

I've been trying for so long and deleted and installed the repo again and again, and also deleted node_modules and package-lock.json and then npm install but getting the same error again. Help me out!

For details, here is the complete list of errors I am getting (it's a bit long):

Packages:

 node v10.19.0 npm 6.14.4 OS: Ubunut 20.04LTS

 "gatsby": "^2.31.1", "gatsby-cli": "^2.18.0", "gatsby-link": "^2.10.0", "gatsby-plugin-catch-links": "^2.9.0", "gatsby-plugin-feed": "^2.12.0", "gatsby-plugin-flow": "^1.9.0", "gatsby-plugin-google-gtag": "^2.7.0", "gatsby-plugin-manifest": "^2.11.0", "gatsby-plugin-netlify": "^2.10.0", "gatsby-plugin-netlify-cms": "^4.9.0", "gatsby-plugin-offline": "^3.9.0", "gatsby-plugin-optimize-svgs": "^1.0.5", "gatsby-plugin-react-helmet": "^3.9.0", "gatsby-plugin-sass": "^3.1.0", "gatsby-plugin-sharp": "^2.13.1", "gatsby-plugin-sitemap": "^2.11.0", "gatsby-remark-autolink-headers": "^2.10.0", "gatsby-remark-copy-linked-files": "^2.9.0", "gatsby-remark-external-links": "0.0.4", "gatsby-remark-images": "^3.10.0", "gatsby-remark-katex": "^3.9.0", "gatsby-remark-prismjs": "^3.12.0", "gatsby-remark-relative-images": "^2.0.2", "gatsby-remark-responsive-iframe": "^2.10.0", "gatsby-remark-smartypants": "^2.9.0", "gatsby-source-filesystem": "^2.10.0", "gatsby-transformer-remark": "^2.15.0", "gatsby-transformer-sharp": "^2.11.0", 

4 Answers

My problem was similar. I installed a new Gatsby site, no plugins, and when making simple HTML changes, then previewing the DEVELOP site and refreshing, every time I would see these webpack errors that were cryptic at best.

This fixed everything:

1. Stop server (ctrl+C)
2. Run gatsby clean
3. Delete node_modules folder
4. Delete package-lock.json file
5. Install Yarn if it isn't installed already (npm install -g yarn)
6. Run yarn install (yarn install)
7. Restart your server and test (gatsby develop)

Credit goes to Ferran.

1

The issues are quite self-explanatory:

/home/myPC/Documents/blog/src/components/Feed/Feed.js 4:13 error Parsing error: Unexpected token {
✖ 1 problem (1 error, 0 warnings)
File: src/components/Feed/Feed.js
/home/myPC/Documents/blog/src/components/Icon/Icon.js 5:6 error Parsing error: Unexpected token Props
✖ 1 problem (1 error, 0 warnings)
File: src/components/Icon/Icon.js

And so on...

As you can see in their repository, you must use yarn instead of npm since the dependencies are lock using yarn.lock file.

So, remove your node_modules, your cache folder and run yarn install(you may need to install it before).

3

I got this error because there was an apostrophe and/or space in my windows username. Switching to another user solved the problem. If your error includes the following this might be your problem too.

./node_modules/@pmmmwh/react-refresh-webpack-plugin/loader/index.js

I just removed node modules , cache folder and public folder . After that I simply run

npm i
gatsby clean && gatsby build

My issue was fixed after that

Your Answer

Sign up or log in

Sign up using Google Sign up using Facebook Sign up using Email and Password Submit

Post as a guest

Post Your Answer Discard

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.