Webpack CLI does not work in project

Question

I have followed the instructions to a React tutorial. I installed NPM using npm install in the terminal and was able to start the node server. The issue is I am unable to run Webpack to view updates in my browser.

When I type webpack --watch as instructed, the terminal gives the error message: 'webpack' not found, but Webpack has been installed in node_modules. Why is this happening?

Answer 1

You must know the difference of installing locally and globally, and when to do so. Per the NPM Documentation:

If you want to use it as a command line tool, something like the grunt CLI, then you want to install it globally. On the other hand, if you want to depend on the package from your own module using something like Node's require, then you want to install locally. (emphasis mine)

Thus, you must install Webpack globally to use its CLI (command line interface). Do:

npm install webpack -g

That way, it's globally installed and you can run Webpack through the command line with the webpack command. If you don't install it globally, you can still use the path to the locally installed module and execute as such:

./node_modules/.bin/webpack --watch

This might be a bit inconvenient and you should opt for the global install. See the Webpack Documentation for more details.