Laravel 8 Mix npm run development error with vue.js - node.js

Question

I've laravel Vue js project. I need to make changes to our project but when I try to use npm run development to reflect my changes but I got the below-mentioned error in Mac System.
fleetcart# dev /home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com
> npm run development
> fleetcart# development /home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com
> cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --config=node_modules/laravel-mix/setup/webpack.config.js
Browserslist: caniuse-lite is outdated. Please run:
npx browserslist#latest --update-db
Why you should do it regularly: https://github.com/browserslist/browserslist#browsers-data-updating
/home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/Themes/Storefront/node_modules/webpack/lib/NormalModule.js:207
throw new TypeError(
^
TypeError: The 'compilation' argument must be an instance of Compilation
at Function.getCompilationHooks (/home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/Themes/Storefront/node_modules/webpack/lib/NormalModule.js:207:10)
at /home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/Themes/Storefront/node_modules/mini-css-extract-plugin/dist/index.js:394:103
at SyncHook.eval [as call] (eval at create (/home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/tapable/lib/HookCodeFactory.js:19:10), <anonymous>:7:1)
at SyncHook.lazyCompileHook (/home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/tapable/lib/Hook.js:154:20)
at Compiler.newCompilation (/home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/webpack/lib/Compiler.js:631:26)
at /home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/webpack/lib/Compiler.js:667:29
at AsyncSeriesHook.eval [as callAsync] (eval at create (/home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:4:1)
at AsyncSeriesHook.lazyCompileHook (/home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/tapable/lib/Hook.js:154:20)
at Compiler.compile (/home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/webpack/lib/Compiler.js:662:28)
at /home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/webpack/lib/Compiler.js:321:11
at Compiler.readRecords (/home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/webpack/lib/Compiler.js:529:11)
at /home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/webpack/lib/Compiler.js:318:10
at eval (eval at create (/home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:9:1)
at /home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/webpack/lib/CachePlugin.js:50:13
at AsyncSeriesHook.eval [as callAsync] (eval at create (/home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:5:1)
at AsyncSeriesHook.lazyCompileHook (/home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/tapable/lib/Hook.js:154:20)
at /home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/webpack/lib/Compiler.js:315:19
at AsyncSeriesHook.eval [as callAsync] (eval at create (/home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:13:1)
at AsyncSeriesHook.lazyCompileHook (/home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/tapable/lib/Hook.js:154:20)
at Compiler.run (/home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/webpack/lib/Compiler.js:312:24)
at processOptions (/home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/webpack-cli/bin/cli.js:353:14)
at /home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/webpack-cli/bin/cli.js:364:3
at Object.parse (/home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/webpack-cli/node_modules/yargs/yargs.js:576:18)
at /home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/webpack-cli/bin/cli.js:49:8
at Object.<anonymous> (/home/virtual/vps-e25466/2/2c563f2522/staging.pnutso.com/node_modules/webpack-cli/bin/cli.js:366:3)
at Module._compile (internal/modules/cjs/loader.js:1158:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1178:10)
at Module.load (internal/modules/cjs/loader.js:1002:32)
at Function.Module._load (internal/modules/cjs/loader.js:901:14)
at Module.require (internal/modules/cjs/loader.js:1044:19)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! fleetcart# development: `cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --config=node_modules/laravel-mix/setup/webpack.config.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the fleetcart# development script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /home/virtual/vps-e25466/2/2c563f2522/.npm/_logs/2022-11-11T12_21_33_478Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! fleetcart# dev: `npm run development`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the fleetcart# dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /home/virtual/vps-e25466/2/2c563f2522/.npm/_logs/2022-11-11T12_21_33_490Z-debug.log
Below is my package.json file:
{
"name": "fleetcart",
"private": true,
"scripts": {
"rtlcss": "rtlcss",
"postinstall": "lerna bootstrap",
"dev": "npm run development",
"development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --config=node_modules/laravel-mix/setup/webpack.config.js",
"watch": "npm run development -- --watch",
"watch-poll": "npm run watch -- --watch-poll",
"prod": "npm run production",
"production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --config=node_modules/laravel-mix/setup/webpack.config.js"
},
"devDependencies": {
"#babel/preset-env": "^7.19.4",
"cross-env": "^6.0.2",
"eslint": "^8.26.0",
"eslint-config-spatie": "^2.0.3",
"eslint-plugin-import": "^2.26.0",
"glob": "^7.2.3",
"laravel-mix": "^6.0.49",
"laravel-mix-merge-manifest": "^0.1.2",
"lerna": "^6.0.2",
"rtlcss": "^4.0.0",
"sass": "^1.56.0",
"sass-loader": "^8.0.2",
"vue-template-compiler": "^2.7.13",
"webpack-shell-plugin": "^0.5.0"
},
"dependencies": {
"webpack": "^5.74.0"
}
}
Earlier when I run npm run dev cmd then getting some strange error related to the library version mismatch error so I updated Laravel-Mix lib to 6.0.12 and try to run but after too much research, not get any results.
I removed the node_modules, package.json file from the root folder and then again reinstalled it, but nothing happened.
I used the below-mentioned command in the development script:
cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --config=node_modules/laravel-mix/setup/webpack.config.js
Please let me know if anyone has an idea to reflect my changes to live server after npme run dev command.
Thank You in advance.