CSS-로더 종속성 피어 Webpack5 오류 해결

Question

实际上，我对 javascript 很陌生，我想将 vue-audio-visual 安装到我的项目中。但我在节点控制台中遇到了奇怪的错误，我不知道有什么关系。 npm 错误如下所示：

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

但是，在我的 package.json 文件中，我使用这些依赖项 css-loader": "^6.6.0"

和 vue 部门：

<code>&quot;devDependencies&quot;: {
  &quot;@vue/cli-plugin-babel&quot;: &quot;~4.5.0&quot;,
  &quot;@vue/cli-plugin-router&quot;: &quot;^4.5.15&quot;,
  &quot;@vue/cli-service&quot;: &quot;~4.5.0&quot;,
  &quot;@vue/compiler-sfc&quot;: &quot;^3.0.0&quot;,
  &quot;webpack&quot;: &quot;^4.46.0&quot;
}
</code>

有人可以向我解释一下我应该做什么吗？

Answer 1

Vite 대신 Vue3 및 Webpack을 사용하고 계십니까?
이것이 알려진 옵션인지는 확실하지 않지만 Vite를 권장하고 싶습니다.

---

이 문제가 발생하는 이유는 오류에 잘 설명되어 있습니다. 번역해 보겠습니다:

특정 패키지의 변경 로그를 확인하면 Webpack 5가 실제로 강제 업그레이드임을 알 수 있습니다

자유롭게:

• Vite로 전환
• npm을 사용하여 Webpack 5 설치
• 더 나은 오류를 위해 Yarn/pnpm을 사용하여 작업하세요