Webpack이 스타일 로더 문제를 설치할 수 없음(Vue.js 2)
<p>我需要安装style-loader는 'bootstrap-icons/font/bootstrap-icons.css'를 가져옵니다.
<pre class="brush:php;toolbar:false;">npm ERR! 코드 ERESOLVE
npm 오류입니다! ERESOLVE가 종속성 트리를 확인할 수 없습니다.
npm 오류입니다!
npm 오류입니다! 해결 중: undefined@undefine
npm 오류입니다! 발견됨: webpack@4.46.0
npm 오류입니다! node_modules/웹팩
npm 오류입니다! 루트 프로젝트의 dev webpack@"^4.41.2"
npm 오류입니다!
npm 오류입니다! 종속성을 해결할 수 없습니다.
npm 오류입니다! style-loader@3.3.3의 피어 webpack@"^5.0.0"
npm 오류입니다! node_modules/스타일-로더
npm 오류입니다! 루트 프로젝트의 style-loader@"*"
npm 오류입니다!
npm 오류입니다! 업스트림 종속성 충돌을 해결하거나 다시 시도하세요.
npm 오류입니다! --force 또는 --legacy-peer-deps를 사용한 이 명령
npm 오류입니다! 잘못된(그리고 잠재적으로 손상될 수 있는) 종속성 해결을 허용합니다.
npm 오류입니다!
npm 오류입니다! 전체 보고서는 /Users/jessiechen/.npm/eresolve-report.txt를 참조하세요.
npm 오류입니다! 이 실행의 전체 로그는 다음에서 찾을 수 있습니다.
npm 오류입니다! /Users/jessiechen/.npm/_logs/2023-07-16T00_15_26_704Z-debug-0.log</pre>
<p>저는 webpack.config.js를 좋아합니다.</p>
<pre class="brush:php;toolbar:false;">var HtmlWebpackPlugin = require('html-webpack-plugin');
모듈.수출 = {
모드: '개발',
해결하다: {
확장자: ['.js', '.jsx','.vue', '.css'],
모듈: [
'노드_모듈'
]
},
모듈: {
규칙: [
{
테스트: /.vue?$/,
제외: /(node_modules)/,
사용: 'vue-loader'
},
{
테스트: /.js?$/,
제외: /(node_modules)/,
사용: '바벨 로더'
},
{
테스트: /.css$/i,
사용: [{loader:'style-loader'}, {loader: 'css-loader'}],
},
{
테스트: /.(png|jpe?g|gif)$/i,
사용: [
{
로더: '파일 로더',
옵션: {
es모듈: 거짓
}
},
],
},
]
},
플러그인: [새로운 HtmlWebpackPlugin({
템플릿: './src/index.html'
})],
개발자서버: {
HistoryApiFallback: 사실
},
외부: {
// 전역 앱 구성 객체
구성: JSON.stringify({
apiUrl: 'http://localhost:4000'
})
},
}</pre>
<p>这是我的package.json文件:</p>
<pre class="brush:php;toolbar:false;">{
"스크립트": {
"start": "webpack-dev-server --open",
"build": "webpack --모드 제작"
},
"종속성": {
"@babel/runtime": "^7.22.6",
"부트스트랩": "^5.3.0",
"bootstrap-icons": "^1.10.5",
"재생성기 런타임": "^0.13.11",
"vee-validate": "^2.2.8",
"vue": "^2.6.10",
"vue-router": "^3.1.3",
"vuex": "^3.1.2",
"xlsx": "^0.18.5"
},
"devDependency": {
"@babel/plugin-transform-runtime": "^7.22.7",
"바벨 코어": "^6.26.0",
"babel-loader": "^7.1.5",
"babel-preset-env": "^1.6.1",
"babel-preset-stage-0": "^6.24.1",
"babel-preset-vue": "^2.0.2",
"css-loader": "^3.3.2",
"파일 로더": "^6.2.0",
"html-webpack-plugin": "^3.2.0",
"경로": "^0.12.7",
"vue-loader": "^14.2.3",
"vue-template-compiler": "^2.6.10",
"웹팩": "^4.41.2",
"webpack-cli": "^3.3.10",
"webpack-dev-server": "^3.9.0"
}
}</pre>
<p>package.lock.json 파일을 삭제하고 모든 패키지를 다시 설치해 보았지만 스타일 로더를 설치하려고 할 때마다 오류가 발생합니다. </p>