React: "react-scripts start" cannot find module webpack

Question

I am getting this error when I am not even using webpack in this particular branch. I have never encountered this error in my main branch before. However, I wanted to learn webpack so I created a webpack branch of my project and install webpack in that branch(Assuming that I did correctly install webpack locally). Now when I switch back to my main, and tried to run "npm start". I am getting into this error.

> react-scripts start

module.js:550
    throw err;
    ^

Error: Cannot find module 'webpack'
    at Function.Module._resolveFilename (module.js:548:15)
    at Function.Module._load (module.js:475:25)
    at Module.require (module.js:597:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (C:\Users\pzheng\my-app\node_modules\webpack-dev-server\lib\Server.js:22:17)
    at Module._compile (module.js:653:30)
    at Object.Module._extensions..js (module.js:664:10)
    at Module.load (module.js:566:32)
    at tryModuleLoad (module.js:506:12)
    at Function.Module._load (module.js:498:3)

When I tried to run "npm run build", this error appears instead:

Error: Cannot find module 'webpack/lib/Chunk'
    at Function.Module._resolveFilename (module.js:548:15)
    at Function.Module._load (module.js:475:25)
    at Module.require (module.js:597:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (C:\Users\pzheng\my-app\node_modules\extract-text-webpack-plugin\dist\index.js:17:14)
    at Module._compile (module.js:653:30)
    at Object.Module._extensions..js (module.js:664:10)
    at Module.load (module.js:566:32)
    at tryModuleLoad (module.js:506:12)
    at Function.Module._load (module.js:498:3)
    at Module.require (module.js:597:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (C:\Users\pzheng\my-app\node_modules\extract-text-webpack-plugin\dist\cjs.js:3:18)
    at Module._compile (module.js:653:30)
    at Object.Module._extensions..js (module.js:664:10)
    at Module.load (module.js:566:32)

Many SO posts suggesting downloading webpack, but I do not wish to use webpack for this branch, so many SO posts are not helpful.

What I have tried: I checked my package.json file, there is no webpack dependency in my main branch. However, I do see webpack in my package.lock.json file when I search for the word webpack

What I am using: I am using create-react-app library.

What I need help with: I am trying to figure out the cause of this error and how to fix it. Does it have to do with me installing webpack in the other branch?

I usually just drop the node_modules folder and run npm install again, but certainly it isn't an answer to the "why" question. — 0xc14m1z
– 0xc14m1z, Commented Jan 8, 2019 at 15:43
when I am not even using webpack in this particular branch. What do you exactly mean by "branch" here? — hindmost
– hindmost, Commented Jan 8, 2019 at 15:47
@hindmost I am refeering to the git branch. so I started off my project using create-react-app. It is like my personal project to practice react. Then I trying to learn webpack, so I created a seperarte branch where I installed webpack. — ZpfSysn
– ZpfSysn, Commented Jan 8, 2019 at 15:49
@aDev webpack comes shipped with create-react-app, you don't need to install it again. If you need to tweak it's configuration, then you should eject your app. — 0xc14m1z
– 0xc14m1z, Commented Jan 8, 2019 at 15:51

glocore · Accepted Answer · 2019-02-23 04:28:18Z

25

I faced this when I was trying to use react-scripts in an existing react app that wasn't scaffolded using create-react-app. The problem was the package-lock file. Deleting node_modules and package-lock.json and running npm install did the trick for me.

answered Feb 23, 2019 at 4:28

glocore

2,2142 gold badges17 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Sergio Belevskij Over a year ago

Don't forget remove "webpack" and "webpack-dev-server" dependencies from package.json.

John Bachir Over a year ago

Ashwin M you are a scholar and a gentleperson

ZpfSysn · Accepted Answer · 2019-01-08 16:19:14Z

2

Ok, this is weird but this is how I fixed it.

I think this error has to do with "react-script"

I was using [email protected], as soon as I upgrade my react script to 2.1.3, which is the latest version published 4 days ago, this error is fixed.

answered Jan 8, 2019 at 16:19

ZpfSysn

8892 gold badges12 silver badges33 bronze badges

Comments

Jon Leopard · Accepted Answer · 2019-01-08 16:28:50Z

0

You are using CRA (Create React App) which is already using webpack (with it's own config file). CRA offers the option to 'eject', which will expose the webpack config file that you can then modify and play with. If you do choose to eject, do so on another branch (in case you decide to go back). Be aware that ejecting is non-reversible.

Hope this helps!

answered Jan 8, 2019 at 16:28

Jon Leopard

1,0941 gold badge13 silver badges24 bronze badges

Comments

Ganesh Garad · Accepted Answer · 2024-10-22 04:57:27Z

0

I Was Facing the same issue and fixed it using the following command in the terminal in the project directory.

npm audit --fix

This resolved the issue.

answered Oct 22, 2024 at 4:57

Ganesh Garad

3812 silver badges6 bronze badges

Collectives™ on Stack Overflow

React: "react-scripts start" cannot find module webpack

4 Answers 4

2 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

2 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related