찾다

 >  Q&A  >  본문

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>
P粉864872812P粉864872812488일 전808

모든 응답(1)나는 대답할 것이다

  • P粉133321839

    P粉1333218392023-07-30 09:14:21

    npm install style-loader --legacy-peer-deps를 실행하세요. 도구에서 표시되는 오류 메시지를 숙지하고 신뢰하면 도움이 됩니다.

    그러나 종속성도 업데이트해야 합니다(npm이 오래된지 확인). 호환되지 않는 다양한 패키지 버전이 있습니다. 주요 변경 사항(버전 번호의 가장 왼쪽 숫자가 변경됨)이 있는 패키지의 경우 일반적으로 GitHub 저장소 또는 릴리스 탭에서 찾을 수 있는 패키지 변경 로그를 확인할 수 있습니다.

    회신하다
    0
  • 취소회신하다