Could not resolve dependency peer Webpack5 for css-loader - javascript

Actually, I am very new with javascript, I want to install vue-audio-visual to my project. But I got weird error in my node console which I don't know what's the relation. The npm error shown like below:
code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: css-loader#6.6.0
npm ERR! Found: webpack#4.46.0
npm ERR! node_modules/webpack
npm ERR! peer webpack#"^4.0.0 || ^5.0.0" from #soda/friendly-errors-webpack-plugin#1.8.1
npm ERR! node_modules/#soda/friendly-errors-webpack-plugin
npm ERR! #soda/friendly-errors-webpack-plugin#"^1.7.1" from #vue/cli-service#4.5.15
npm ERR! node_modules/#vue/cli-service
npm ERR! peer #vue/cli-service#"^3.0.0 || ^4.0.0-0" from #vue/cli-plugin-babel#4.5.15
npm ERR! node_modules/#vue/cli-plugin-babel
npm ERR! dev #vue/cli-plugin-babel#"~4.5.0" from the root project
npm ERR! 3 more (#vue/cli-plugin-router, #vue/cli-plugin-vuex, the root project)
npm ERR! webpack#"^4.0.0" from #vue/cli-plugin-babel#4.5.15
npm ERR! node_modules/#vue/cli-plugin-babel
npm ERR! dev #vue/cli-plugin-babel#"~4.5.0" from the root project
npm ERR! 19 more (cache-loader, thread-loader, #vue/cli-service, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer webpack#"^5.0.0" from css-loader#6.6.0
npm ERR! node_modules/css-loader
npm ERR! peer css-loader#"*" from vue-loader#15.10.0
npm ERR! node_modules/vue-loader
npm ERR! vue-loader#"^15.9.2" from #vue/cli-service#4.5.15
npm ERR! node_modules/#vue/cli-service
npm ERR! peer #vue/cli-service#"^3.0.0 || ^4.0.0-0" from #vue/cli-plugin-babel#4.5.15
npm ERR! node_modules/#vue/cli-plugin-babel
npm ERR! 3 more (#vue/cli-plugin-router, #vue/cli-plugin-vuex, the root project)
npm ERR! css-loader#"^6.6.0" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: webpack#5.74.0
npm ERR! node_modules/webpack
npm ERR! peer webpack#"^5.0.0" from css-loader#6.6.0
npm ERR! node_modules/css-loader
npm ERR! peer css-loader#"*" from vue-loader#15.10.0
npm ERR! node_modules/vue-loader
npm ERR! vue-loader#"^15.9.2" from #vue/cli-service#4.5.15
npm ERR! node_modules/#vue/cli-service
npm ERR! peer #vue/cli-service#"^3.0.0 || ^4.0.0-0" from #vue/cli-plugin-babel#4.5.15
npm ERR! node_modules/#vue/cli-plugin-babel
npm ERR! 3 more (#vue/cli-plugin-router, #vue/cli-plugin-vuex, the root project)
npm ERR! css-loader#"^6.6.0" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /Users/julapps/.npm/eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/julapps/.npm/_logs/2022-10-23T12_42_49_511Z-debug-0.log
However, in my package.json file i use these dependencies
css-loader": "^6.6.0"
and vue dep:
"devDependencies": {
"#vue/cli-plugin-babel": "~4.5.0",
"#vue/cli-plugin-router": "^4.5.15",
"#vue/cli-service": "~4.5.0",
"#vue/compiler-sfc": "^3.0.0",
"webpack": "^4.46.0"
}
Can somebody explain to me what should I do?

You're using Vue3 with Webpack rather than Vite?
Not sure if it's a known choice but I rather recommend Vite.
As of why this issue, the error explains it well. Let me translate:
To install css-loader (or anything depending on it), I need at least Webpack 5
If you go check the changelog of the given package, you can see that Webpack 5 is indeed a mandatory upgrade
minimum supported webpack version is 5, we recommend to update to the latest version for better performance
Feel free to:
use Vite rather
install Webpack 5 with npm
work with yarn/pnpm, to get better errors

Related

I am trying to download compression webpack plugin with npm but its giving me error

Hi there this is the message that APPEARS WHEN I TRY TO RUN THE COMMAND
npm install compression-webpack-plugin
and this is the error:
`PS D:\phaser games\game-slot-machine> npm install compression-webpack-plugin
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: phaser3-project-template#1.1.2
npm ERR! Found: webpack#4.46.0
npm ERR! node_modules/webpack
npm ERR! dev webpack#"^4.41.2" from the root projectnpm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer webpack#"^5.1.0" from compression-webpack-plugin#10.0.0
npm ERR! node_modules/compression-webpack-plugin
npm ERR! compression-webpack-plugin#"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-dnpm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\Cheetay\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Cheetay\AppData\Local\npm-cache_logs\2023-01-31T07_37_59_109Z-debug-0npm install compression-webpack-plugin --save-devine>
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: phaser3-project-template#1.1.2
npm ERR! Found: webpack#4.46.0
npm ERR! node_modules/webpack
npm ERR! dev webpack#"^4.41.2" from the root projectnpm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer webpack#"^5.1.0" from compression-webpack-plugin#10.0.0
npm ERR! node_modules/compression-webpack-plugin
npm ERR! dev compression-webpack-plugin#"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
n) dependency resolution.
npm ERR!
npm ERR! See C:\Users\Cheetay\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Cheetay\AppData\Local\npm-cache_logs\2023-01-31T07_39_13_026Z-debug-0.log
PS D:\phaser games\game-slot-machine> npm install compression-webpack-plugin --save-dev
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: phaser3-project-template#1.1.2
npm ERR! Found: webpack#4.46.0
npm ERR! node_modules/webpack
npm ERR! dev webpack#"^4.41.2" from the root projectnpm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer webpack#"^5.1.0" from compression-webpack-plugin#10.0.0
npm ERR! node_modules/compression-webpack-plugin
npm ERR! dev compression-webpack-plugin#"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\Cheetay\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Cheetay\AppData\Local\npm-cache_logs\2023-01-31T07_39_20_653Z-debug-0.log`
i am trying to reduce size of my js file in a game and trying to download this plugin that reduces the size.
first, you need to fix the conflict between both the dependency if you want to run both commands at one time, or using --force is also an option if you really want to compress the file.

Expo build android failed React native

I am not able to generate the internal apk since the expo SDK 47 update occurred, I get an error installing dependencies on some occasions and in Run gradlew.
I show the error in installation of dependencies:
Running "npm install" in the root dir of your repository 2[stderr] npm ERR!3[stderr] code ERESOLVE4[stderr] npm ERR! ERESOLVE could not resolve5[stderr] npm ERR! 6[stderr] npm ERR! While resolving: react-navigation-tabs#2.11.27[stderr] npm ERR! Found: react-native-gesture-handler#2.8.08[stderr] npm ERR! node_modules/react-native-gesture-handler9[stderr] npm ERR! react-native-gesture-handler#"~2.8.0" from the root project10[stderr] npm ERR! peer react-native-gesture-handler#">= 1.0.0" from #react-navigation/stack#6.3.711[stderr] npm ERR! node_modules/#react-navigation/stack12[stderr] npm ERR! #react-navigation/stack#"^6.3.2" from the root project13[stderr] npm ERR! 1 more (react-native-tab-view)14[stderr] npm ERR! 15[stderr] npm ERR! Could not resolve dependency:16[stderr] npm ERR! peer react-native-gesture-handler#"^1.0.0" from react-navigation-tabs#2.11.217[stderr] npm ERR! node_modules/react-navigation-tabs18[stderr] npm ERR! react-navigation-tabs#"^2.11.2" from the root project19[stderr] npm ERR! 20[stderr] npm ERR! Conflicting peer dependency: react-native-gesture-handler#1.10.321[stderr] npm ERR! node_modules/react-native-gesture-handler22[stderr] npm ERR! peer react-native-gesture-handler#"^1.0.0" from react-navigation-tabs#2.11.223[stderr] npm ERR! node_modules/react-navigation-tabs24[stderr] npm ERR! react-navigation-tabs#"^2.11.2" from the root project25[stderr] npm ERR! 26[stderr] npm ERR! Fix the upstream dependency conflict, or retry27[stderr] npm ERR! this command with --force, or --legacy-peer-deps28[stderr] npm ERR! to accept an incorrect (and potentially broken) dependency resolution.29[stderr] npm ERR! 30[stderr] npm ERR! See /home/expo/.npm/eresolve-report.txt for a full report.31[stderr] 32[stderr] npm ERR! A complete log of this run can be found in:33[stderr] npm ERR! /home/expo/.npm/_logs/2022-12-09T04_28_24_722Z-debug-0.log34npm exited with non-zero code: 1
I show the error in "Run gradlew":
delete the package-lock.json file, delete the node_modules folder, npm cache clean --force, npm cache verify and install npm install again

npm install command is showing bunch of error - Why?

I am tying to install a package
npm install vuejs-image-gallery
but when I run this commandon the terminal I got this bunch of errro message :=(
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: #vue/cli-plugin-eslint#5.0.8
npm ERR! Found: eslint#6.8.0
npm ERR! node_modules/eslint
npm ERR! peer eslint#"^5.16.0 || ^6.1.0 || ^7.2.0" from #vue/eslint-config-airbnb#5.3.0
npm ERR! node_modules/#vue/eslint-config-airbnb
npm ERR! dev #vue/eslint-config-airbnb#"^5.3.0" from the root project
npm ERR! peer eslint#">= 4.12.1" from babel-eslint#10.1.0
npm ERR! node_modules/babel-eslint
npm ERR! dev babel-eslint#"^10.0.3" from the root project
npm ERR! 5 more (eslint-config-airbnb-base, eslint-plugin-import, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer eslint#">=7.5.0" from #vue/cli-plugin-eslint#5.0.8
npm ERR! node_modules/#vue/cli-plugin-eslint
npm ERR! dev #vue/cli-plugin-eslint#"^5.0.8" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: eslint#8.25.0
npm ERR! node_modules/eslint
npm ERR! peer eslint#">=7.5.0" from #vue/cli-plugin-eslint#5.0.8
npm ERR! node_modules/#vue/cli-plugin-eslint
npm ERR! dev #vue/cli-plugin-eslint#"^5.0.8" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /Users/hello/.npm/eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/hello/.npm/_logs/2022-10-21T06_05_43_010Z-debug-0.log
I also try to install that package using this command:
npm install vuejs-image-gallery legacy-peer-deps
This command is install the package but on my vue application it's saying:
can't find the moudle
So, Something is wrong. Would you please tell me what is wrong by check that error message?

ESLint dependency fail

I want to use ESLint on a React project on VSCode, but it doesn't work. When I enter
npm install
it shows me this:
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: type-fest#0.20.2
npm ERR! node_modules/type-fest
npm ERR! type-fest#"^0.20.2" from globals#13.10.0
npm ERR! node_modules/#eslint/eslintrc/node_modules/globals
npm ERR! globals#"^13.9.0" from #eslint/eslintrc#0.4.3
npm ERR! node_modules/#eslint/eslintrc
npm ERR! #eslint/eslintrc#"^0.4.3" from eslint#7.32.0
npm ERR! node_modules/eslint
npm ERR! dev eslint#"^7.32.0" from the root project
npm ERR! 18 more (#typescript-eslint/eslint-plugin, ...)
npm ERR! type-fest#"^0.20.2" from globals#13.10.0
npm ERR! node_modules/eslint/node_modules/globals
npm ERR! globals#"^13.6.0" from eslint#7.32.0
npm ERR! dev eslint#"^7.32.0" from the root project
npm ERR! 18 more (#typescript-eslint/eslint-plugin, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peerOptional type-fest#"^0.13.1" from #pmmmwh/react-refresh-webpack-plugin#0.4.2
npm ERR! node_modules/#pmmmwh/react-refresh-webpack-plugin
npm ERR! #pmmmwh/react-refresh-webpack-plugin#"0.4.2" from react-scripts#4.0.1
npm ERR! node_modules/react-scripts
npm ERR! react-scripts#"4.0.1" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\Leo\AppData\Local\npm-cache\eresolve-report.txt for
a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Leo\AppData\Local\npm-cache\_logs\2021-08-07T10_27_10_092Z-debug.log
According to you log, npm install seems to have an issue with the type-fest dependency. You can try running npm install --save type-fest to save it to your dependencies, then retry.

Hello, Install DateTimePicker in my expo project (React native)

as the title suggests I'm trying to install DateTimePicker and I get this error:
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: undefined#undefined
npm ERR! Found: react#16.13.1
npm ERR! node_modules/react
npm ERR! react#"16.13.1" from the root project
npm ERR! peer react#">=16.8.3" from #react-native-community/datetimepicker#3.0.4
npm ERR! node_modules/#react-native-community/datetimepicker
npm ERR! #react-native-community/datetimepicker#"3.0.4" from the root project
npm ERR! 1 more (react-native)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"17.0.1" from react-native-windows#0.64.5
npm ERR! node_modules/react-native-windows
npm ERR! peer react-native-windows#">=0.62" from #react-native-community/datetimepicker#3.0.4
npm ERR! node_modules/#react-native-community/datetimepicker
npm ERR! #react-native-community/datetimepicker#"3.0.4" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\robbi\AppData\Local\npm-cache\eresolve-report.txt for a full report.
How can I do?
Sorry for the stupid question but I'm still studying ..
If you are using expo download your dependency through
expo install #react-native-community/datetimepicker
If you have used yarn or npm for that some dependencies might have a conflict with each other (because of incompatibility issues) whereas through expo install it will install the respective version of the package according to your expo version

Categories

Resources