Webpack tidak dapat memasang masalah pemuat gaya (Vue.js 2)
<p>我需要安装style-loader以便能够加载import 'bootstrap-icons/font/bootstrap-icons.css'。然而,当我能够加载import 'bootstrap-icons/font/bootstrap-icons.css'。然而,当我输入加载玶入丯玶丯入亗玶丯入亗亗丯亗丯入亗簵/p>
<pre class="brush:php;toolbar:false;">npm ERR! kod ERESOLVE
npm ERR! ERESOLVE tidak dapat menyelesaikan pepohon pergantungan
npm ERR!
npm ERR! Semasa menyelesaikan: undefined@undefined
npm ERR! Ditemui: webpack@4.46.0
npm ERR! node_modules/webpack
npm ERR! dev webpack@"^4.41.2" daripada projek root
npm ERR!
npm ERR! Tidak dapat menyelesaikan pergantungan:
npm ERR! peer webpack@"^5.0.0" daripada style-loader@3.3.3
npm ERR! node_modules/style-loader
npm ERR! style-loader@"*" daripada projek root
npm ERR!
npm ERR! Betulkan konflik pergantungan huluan, atau cuba semula
npm ERR! arahan ini dengan --force, atau --legacy-peer-deps
npm ERR! untuk menerima resolusi pergantungan yang salah (dan berpotensi rosak).
npm ERR!
npm ERR! Lihat /Users/jessiechen/.npm/eresolve-report.txt untuk laporan penuh.
npm ERR! Log lengkap larian ini boleh didapati di:
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 = memerlukan('html-webpack-plugin');
module.exports = {
mod: 'pembangunan',
selesaikan: {
sambungan: ['.js', '.jsx','.vue', '.css'],
modul: [
'node_modules'
]
},
modul: {
peraturan: [
{
ujian: /.vue?$/,
kecualikan: /(node_modules)/,
gunakan: 'vue-loader'
},
{
ujian: /.js?$/,
kecualikan: /(node_modules)/,
gunakan: 'babel-loader'
},
{
ujian: /.css$/i,
gunakan: [{loader:'style-loader'}, {loader: 'css-loader'}],
},
{
ujian: /.(png|jpe?g|gif)$/i,
gunakan: [
{
pemuat: 'pemuat fail',
pilihan: {
esModul: palsu
}
},
],
},
]
},
pemalam: [HtmlWebpackPlugin baharu({
templat: './src/index.html'
})],
devServer: {
historyApiFallback: benar
},
luaran: {
// objek konfigurasi aplikasi global
konfigurasi: JSON.stringify({
apiUrl: 'http://localhost:4000'
})
},
}</pre>
<p>这是我的package.json文件:</p>
<pre class="brush:php;toolbar:false;">{
"skrip": {
"start": "webpack-dev-server --open",
"build": "webpack --mode production"
},
"kebergantungan": {
"@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",
"laluan": "^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>Saya telah cuba memadamkan fail package.lock.json dan memasang semula semua pakej, tetapi saya mendapat ralat setiap kali saya cuba memasang pemuat gaya. </p>