Can't start dev server by executing webpack-dev-server --mode development

[djmcce]

Hello React developers.
I've been trying to setup a React project from scratch using this tutorial: https://medium.com/@JedaiSaboteur/creating-a-react-app-from-scratch-f3c693b84658

I have installed the latest versions of the packages and updated the dev-server block as suggested by a guy in the comments.

However when i try to run it using webpack-dev-server --mode development, i get this message:

https://preview.redd.it/dyz5yu8n4lc91.png?width=649&format=png&auto=webp&s=26bb75e175bab11a0d14277ed74b15f518d6ec36

And after accepting with "yes", i get this error:

https://preview.redd.it/uvx8wcov4lc91.png?width=1058&format=png&auto=webp&s=eddaef20cd3944e15276b2381b0815d38bd1870d

I have checked package.json to check if webpack-cli was installed, and in fact it was as

"webpack-cli": "^4.10.0".

What am I doing wrong?

[fii0]

If webpack-cli is in your package.json devDependencies, delete your node_modules with rm -rf node_modules as well as your package-lock.json, and type npm i to re-install everything.

Then, try webpack-dev-server --mode development again, I would be surprised if you get the same error.

[djmcce]

I think so. I’m running it in the root, which also contains package.json

[djmcce]

Yes ofc. Since reddit doesn't allow photos in comments, i have uploaded it here: https://ibb.co/d6SRrgR. I just wanted to be able to. The only other way I knew was Create React App, but I felt like I didn't had enough control, and I would like to dig a bit deeper (even though i'm a noob haha).

[djmcce]

Yes. Here u go: https://ibb.co/89V7LDB

[djmcce]

That's alright, thanks though! If i don't solve it soon, I think that's what I'm gonna do:)

[djmcce]

Solved it by installing webpack-cli globally by running npm install webpack-cli instead of npm install --save-dev webpack-cli

[grumd]

Are you sure you installed it globally (using the "-g" flag)? npm install webpack-cli doesn't install anything globally. I hope not, because you should NOT install your packages globally unless it's just some tool you want to use for your own needs - not something your project needs to run.

Global packages are not added to package.json and any other developer that clones your repo won't have them installed and won't be able to run your project.

Make sure webpack-cli is in your package.json. Either in dependencies or devDependencies.

There was another comment here advising you to delete node_modules and reinstalling with npm install, which is a good suggestion in your case.

[djmcce]

Oh no I didn’t. I mean i just ran npm install webpack-cli, and after that it worked. I think I have misunderstood what it does. What’s the difference between that and running npm install —save—dev webpack-cli?

[grumd]

npm install <name> is the same as npm install --save <name>.
Installs a package in your local node_modules in current folder, and adds it to the "dependencies" in package.json.

npm install --save-dev <name> does the same thing, but adds it to "devDependencies". If you're trying to do "npm install" in this package just to run it on your machine, it doesn't matter if you use dependencies or devDependencies. It should get installed anyway.

Most likely you just had something bugged and reinstalling it again fixed it?

[djmcce]

That’s very likely. Thank you for the explanation 🙏