<p>我需要安装style-loader以便能够加载import 'bootstrap-icons/font/bootstrap-icons.css'。然而，当我输入npm install style-loader时，出现以下错误：</p> <pre class="brush:php;toolbar:false;">npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: undefined@undefined npm ERR! Found: webpack@4.46.0 npm ERR! node_modules/webpack npm ERR! dev webpack@"^4.41.2" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer webpack@"^5.0.0" from style-loader@3.3.3 npm ERR! node_modules/style-loader npm ERR! style-loader@"*" 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/jessiechen/.npm/eresolve-report.txt for a full report. npm ERR! A complete log of this run can be found in: npm ERR! /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'); module.exports = { mode: 'development', resolve: { extensions: ['.js', '.jsx','.vue', '.css'], modules: [ 'node_modules' ] }, module: { rules: [ { test: /.vue?$/, exclude: /(node_modules)/, use: 'vue-loader' }, { test: /.js?$/, exclude: /(node_modules)/, use: 'babel-loader' }, { test: /.css$/i, use: [{loader:'style-loader'}, {loader: 'css-loader'}], }, { test: /.(png|jpe?g|gif)$/i, use: [ { loader: 'file-loader', options: { esModule: false } }, ], }, ] }, plugins: [new HtmlWebpackPlugin({ template: './src/index.html' })], devServer: { historyApiFallback: true }, externals: { // global app config object config: JSON.stringify({ apiUrl: 'http://localhost:4000' }) }, }</pre> <p>这是我的package.json文件：</p> <pre class="brush:php;toolbar:false;">{ "scripts": { "start": "webpack-dev-server --open", "build": "webpack --mode production" }, "dependencies": { "@babel/runtime": "^7.22.6", "bootstrap": "^5.3.0", "bootstrap-icons": "^1.10.5", "regenerator-runtime": "^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" }, "devDependencies": { "@babel/plugin-transform-runtime": "^7.22.7", "babel-core": "^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", "file-loader": "^6.2.0", "html-webpack-plugin": "^3.2.0", "path": "^0.12.7", "vue-loader": "^14.2.3", "vue-template-compiler": "^2.6.10", "webpack": "^4.41.2", "webpack-cli": "^3.3.10", "webpack-dev-server": "^3.9.0" } }</pre> <p>I've tried deleting the package.lock.json file and reinstalling all packages, but I get an error every time I try to install style-loader. </p>