title: webpack-cli failed to load webpack.config.js and couldn't find the html-webpack-plugin
body: <p>I'm trying to migrate my webpack from the v4 version to the v5 everything went ok except when I typed npm run start' for the live server I got a problem with the [Webpack-cli] saying:</p>
  <pre><code>[webpack-cli] Failed to load 'C:\Users\user\Desktop\Test_0.3\starter\webpack.config.js' config
  [webpack-cli] { Error: Cannot find module 'html-webpack-plugin'
      at Function.Module._resolveFilename (internal/modules/cjs/loader.js:636:15)
      at Function.Module._load (internal/modules/cjs/loader.js:562:25)
      at Module.require (internal/modules/cjs/loader.js:692:17)
      at require (C:\Users\user\Desktop\Test_0.3\starter\node_modules\v8-compile-cache\v8-compile-cache.js:159:20)
      at Object.&lt;anonymous&gt; (C:\Users\user\Desktop\Test_0.3\starter\webpack.config.js:2:25)
      at Module._compile (C:\Users\user\Desktop\Test_0.3\starter\node_modules\v8-compile-cache\v8-compile-cache.js:192:30)
      at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10)
      at Module.load (internal/modules/cjs/loader.js:653:32)
      at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
      at Function.Module._load (internal/modules/cjs/loader.js:585:3) code: 'MODULE_NOT_FOUND' }
  </code></pre>
  <p>here is my <code>package.json</code> folder:</p>
  <pre><code>    {
    &quot;name&quot;: &quot;starter&quot;,
    &quot;version&quot;: &quot;1.0.0&quot;,
    &quot;description&quot;: &quot;&quot;,
    &quot;main&quot;: &quot;index.js&quot;,
    &quot;dependencies&quot;: {
      &quot;live-server&quot;: &quot;^1.2.1&quot;
    },
    &quot;devDependencies&quot;: {
      &quot;html-webpack-plugin&quot;: &quot;^5.1.0&quot;,
      &quot;webpack&quot;: &quot;^5.22.0&quot;,
      &quot;webpack-cli&quot;: &quot;^4.5.0&quot;,
      &quot;webpack-dev-server&quot;: &quot;^3.11.2&quot;
    },
    &quot;scripts&quot;: {
      &quot;dev&quot;: &quot;webpack --mode development&quot;,
      &quot;build&quot;: &quot;webpack --mode production&quot;,
      &quot;start&quot;: &quot;webpack serve --mode development --open&quot;
    },
    &quot;author&quot;: &quot;&quot;,
    &quot;license&quot;: &quot;ISC&quot;
  }
  </code></pre>
  <p>the <code>webpack.config.js</code></p>
  <pre><code>const path= require('path')
  const htmlWebpackPlugin=require('html-webpack-plugin');
  
  module.exports={
      entry: './src/js/index.js',
      output:{
          path:path.resolve(__dirname, 'dist'),
          filename:'js/bundle.js'
      },
      devServer:{
          contentBase: './dist'
      },
      plugins:[
          new HtmlWebpackPlugin({
              filename:'index.html',
              template:'./src/index.html'
          })
      ]
  }
  </code></pre>
  <p>also I have another problem which is <code>webpack-cli</code> couldn't find the <code>html-webpack-plugin</code> even though it's installed as you see</p>
  <p>thanks for your help in advance</p>
  <p>I appreciate it</p>