[email protected] requires a peer of grunt@~0.4.0 but none is installed. You must install peer dependencies yourself

Question

I am getting the below error. Does anyone know how to fix it

npm WARN [email protected] requires a peer of grunt@~0.4.0 but none is installed. You must install peer dependencies yourself.

When I did npm install I got the below error

added 1608 packages from 1128 contributors and audited 1615 packages in 75.474s

61 packages are looking for funding
run npm fund for details

found 3 vulnerabilities (1 low, 1 moderate, 1 high)
run npm audit fix to fix them, or npm audit for details

So I run npm audit fix:

62 packages are looking for funding
run npm fund for details

fixed 0 of 3 vulnerabilities in 1674 scanned packages<br>
  3 vulnerabilities required manual review and could not be updated<br>

In the npm WARN. I get the below errors:

npm WARN [email protected] requires a peer of grunt@~0.4.0 but none is installed. You must install peer dependencies yourself.

Can anyone help me fix this?

Package json

{
  "name": "vuekhal",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "auth0-js": "^9.12.2",
    "axios": "^0.19.2",
    "core-js": "^2.6.11",
    "eslint-friendly-formatter": "^4.0.1",
    "extract-text-webpack-plugin": "^4.0.0-beta.0",
    "optimize-css-assets-webpack-plugin": "^5.0.3",
    "v-lazy-image": "^1.3.2",
    "vue": "^2.6.11",
    "vue-router": "^3.1.5",
    "vue-youtube": "^1.4.0"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "^3.12.1",
    "@vue/cli-plugin-eslint": "^3.12.1",
    "@vue/cli-service": "^4.1.2",
    "axios-retry": "^3.1.2",
    "babel": "^6.23.0",
    "babel-eslint": "^10.0.1",
    "babel-loader": "^8.0.6",
    "eslint": "^5.16.0",
    "eslint-plugin-vue": "^5.0.0",
    "grunt": "^1.3.0",
    "qs": "^6.9.1",
    "react": "^16.12.0",
    "uglifyjs-webpack-plugin": "^1.3.0",
    "videojs": "^1.0.0",
    "vue-carousel": "^0.18.0",
    "vue-loader": "^15.9.6",
    "vue-template-compiler": "^2.6.11",
    "vue-truncate-collapsed": "^2.1.0",
    "vue-video-player": "^5.0.2",
    "vue-waypoint": "^3.2.2",
    "vue2-timeago": "^1.2.6",
    "webpack": "^4.41.5",
    "webpack-bundle-tracker": "^0.4.3",
    "webpack-cli": "^3.3.10",
    "webpack-log": "^3.0.1"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended"
    ],
    "rules": {},
    "parserOptions": {
      "parser": "babel-eslint"
    }
  },
  "postcss": {
    "plugins": {
      "autoprefixer": {}
    }
  },
  "browserslist": [
    "> 1%",
    "last 2 versions"
  ],
  "description": "## Project setup ``` npm install ```",
  "main": "babel.config.js",
  "author": "",
  "license": "ISC"
}

Error Message

(Venv) samir@VB:~/Ahmed/Ahmed Dec 2020/Project/vuekhal$ ./node_modules/.bin/webpack --config="build/webpack.prod.conf.js"
/home/samir/Ahmed/Ahmed Dec 2020/Khal/vuekhal/node_modules/webpack-cli/bin/cli.js:93
                                throw err;
                                ^

Error: Cannot find module 'vue-loader/lib/plugin'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:668:15)
    at Function.Module._load (internal/modules/cjs/loader.js:591:27)
    at Module.require (internal/modules/cjs/loader.js:723:19)
    at require (/home/samir/Ahmed/Ahmed Dec 2020/Khal/vuekhal/node_modules/v8-compile-cache/v8-compile-cache.js:159:20)
    at Object.<anonymous> (/home/samir/Ahmed/Ahmed Dec 2020/Khal/vuekhal/build/webpack.base.conf.js:6:25)
    at Module._compile (/home/samir/Ahmed/Ahmed Dec 2020/Khal/vuekhal/node_modules/v8-compile-cache/v8-compile-cache.js:192:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:827:10)
    at Module.load (internal/modules/cjs/loader.js:685:32)
    at Function.Module._load (internal/modules/cjs/loader.js:620:12)
    at Module.require (internal/modules/cjs/loader.js:723:19)
    at require (/home/samir/Ahmed/Ahmed Dec 2020/Khal/vuekhal/node_modules/v8-compile-cache/v8-compile-cache.js:159:20)
    at Object.<anonymous> (/home/samir/Ahmed/Ahmed Dec 2020/Khal/vuekhal/build/webpack.prod.conf.js:7:27)
    at Module._compile (/home/samir/Ahmed/Ahmed Dec 2020/Khal/vuekhal/node_modules/v8-compile-cache/v8-compile-cache.js:192:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:827:10)
    at Module.load (internal/modules/cjs/loader.js:685:32)
    at Function.Module._load (internal/modules/cjs/loader.js:620:12)
    at Module.require (internal/modules/cjs/loader.js:723:19)
    at require (/home/samir/Ahmed/Ahmed Dec 2020/Khal/vuekhal/node_modules/v8-compile-cache/v8-compile-cache.js:159:20)
    at WEBPACK_OPTIONS (/home/samir/Ahmed/Ahmed Dec 2020/Khal/vuekhal/node_modules/webpack-cli/bin/utils/convert-argv.js:114:13)
    at requireConfig (/home/samir/Ahmed/Ahmed Dec 2020/Khal/vuekhal/node_modules/webpack-cli/bin/utils/convert-argv.js:116:6)
    at /home/samir/Ahmed/Ahmed Dec 2020/Khal/vuekhal/node_modules/webpack-cli/bin/utils/convert-argv.js:123:17
    at Array.forEach (<anonymous>)
    at module.exports (/home/samir/Ahmed/Ahmed Dec 2020/Khal/vuekhal/node_modules/webpack-cli/bin/utils/convert-argv.js:121:15)
    at yargs.parse (/home/samir/Ahmed/Ahmed Dec 2020/Khal/vuekhal/node_modules/webpack-cli/bin/cli.js:71:45)
    at Object.parse (/home/samir/Ahmed/Ahmed Dec 2020/Khal/vuekhal/node_modules/webpack-cli/node_modules/yargs/yargs.js:576:18)
    at /home/samir/Ahmed/Ahmed Dec 2020/Khal/vuekhal/node_modules/webpack-cli/bin/cli.js:49:8
    at Object.<anonymous> (/home/samir/Ahmed/Ahmed Dec 2020/Khal/vuekhal/node_modules/webpack-cli/bin/cli.js:366:3)
    at Module._compile (internal/modules/cjs/loader.js:816:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:827:10)
    at Module.load (internal/modules/cjs/loader.js:685:32)