Webpack: After installing webpack and webpack-cli still getting error when running webpack

Question

I have the latest versions of webpack installed:

"webpack": "^4.0.0",
"webpack-cli": "^2.0.9"

Yet when I run webpack in the terminal I get the following:

The CLI moved into a separate package: webpack-cli.
Please install 'webpack-cli' in addition to webpack itself to use the CLI.
-> When using npm: npm install webpack-cli -D
-> When using yarn: yarn add webpack-cli -D

Solution 1

Seems that you had installed globally only webpack and not webpack-cli.

Therefore, npm install -g webpack-cli solves the issue.

---

Explanation and alternative solutions:

Why there is the problem in the first place? The following indicates that both webpack and webpack-cli packages are locally installed:

I have the latest versions of webpack installed:

   "webpack": "^4.0.0",
   "webpack-cli": "^2.0.9"

Running webpack in your terminal cannot find your locally installed version (provided by webpack-cli since webpack-4). That's because your locals executables folder aren't included in your shell PATH variable (list of directories in which the shell looks for commands). The path where npm install executables locally is ./node_modules/.bin (more info here).

Therefore, instead of try running just webpack you need to run:

./node_modules/.bin/webpack

Also, adding to your package.json a script which use just webpack works because npm adds local ./node_modules/.bin/ directory to the shell path before it executes scripts (see npm run).

"scripts": {
    "build": "webpack"
}

Then, execute in your terminal: npm run build

In recap, I think the package.json script is the more clear and desirable way to go.

Solution 2

Try This command Using Npm :

npm i -g webpack-cli -D --save

Solution 3

In webpack version ^4.0.0 the webpack CLI was moved into a different package. Although this change has not been reflected in the docs, there is a pull request addressing that.

Carloluis's answer solve your problem, but I'd like to add that its recommended not to do global installs. So a simple npm install -D webpack-cli in your project folder will do.

Solution 4

webpack team is moving things in to webpack-cli. I tried installing webpack-cli globally it gave me GIT error as shown below.

Please check if you have git installed and in your PATH.

So i first installed GIT from https://gitforwindows.org/ and then installed webpack-cli using npm.

This blog has detail screenshot and remedy to resolve this error Angular webpack GIT and webpack-cli error.

View more solutions

Comments

[Taylor Austin]

This fixed it but now im getting a different error. I will create a new post for that error.

[Kings]

for all curious minds, the above command install the "webpack-cli" globally instead of in your local path. i --> install; g --> global; D -->--save-dev

[daniel]

this could be a solution, but it is short and without explanations, the answer given by carloluis is by far more complete, and should be the answer for the question

[Carloluis]

Also check on GitHub this Webpack 4 Demo project. Hope it helps!