CODEWITHSUNDEEP
webpackvisual-studio-2017
SomeDevTesting123
SomeDevTesting123

Reputation: 259

webpack -v endlessly states that one CLI for webpack must be installed

I have npm version 5.60 installed.

In my package.json I have the following two devDependencies:

"webpack": "~1.12.15",
"webpack-cli": "^3.0.2"

Whenever I enter either webpack or webpack -v in the command line, I always receive the same response:

One CLI for webpack must be installed. These are recommended choices, delivered as separate packages:
- webpack-cli (https://github.com/webpack/webpack-cli)
   The original webpack full-featured CLI.
 - webpack-command (https://github.com/webpack-contrib/webpack-command)
   A lightweight, opinionated webpack CLI.
We will use "npm" to install the CLI via "npm install -D".
Which one do you like to install (webpack-cli/webpack-command):

I have entered webpack-cli here and I have also installed it via npm install --save-dev webpack-cli

I have also tried adding the webpack task runner to visual studio. My solution already has an existing webpack.config.js file. When I select it, I get the blue icon indicating that it utilizes the webpack task runner, but nothing ever appears within the task runner. I think this is just a symptom of webpack not being properly installed, however.

I am using VS 2017 in Windows 10 64.

Any help appreciated.

Upvotes: 23

Views: 19845

Answers (3)

Unantsika
Unantsika

Reputation: 438

Try npm install webpack-cli -g

Upvotes: 33

Cosmin Bacanu
Cosmin Bacanu

Reputation: 517

You could try running the webpack command through yarn or npx:
yarn run webpack
or
npx webpack.

Upvotes: 3

Sujit Singh
Sujit Singh

Reputation: 88

Give Try below steps:

npm uninstall webpack --save-dev

Then change & follow the below step again

npm install [email protected] --save-dev

Now check your webpack.config.js & change "loaders" to "rules" in "webpack.config.js". Below is the code which worked for me :-

var path = require('path');

var webpack = require('webpack');

module.exports = 

{

entry: './js/app.js',

 output: {

  path: path.resolve(__dirname, 'build'),

   filename: 'app.bundle.js'

    },

 module: {

    rules: [
            {
                test: /\.js$/,
                loader: 'babel-loader',
                query: {
                    presets: ['es2015', 'react']
                }
            }
        ]
    },
    stats: {
        colors: true
    },
    devtool: 'source-map'
};

Upvotes: 7

Related Questions