sass-loader与webpack版本冲突解决方案

#npm i 错误解决记录#

最开始错误 :拉取代码,增加依赖时,报错

问题:

在安装sass-loader@10.1.1时,发现与现有的webpack版本有冲突。

当前项目已经安装了webpack@4.28.4(通过peer dependency requirements from other packages),但是sass-loader@10.1.1要求webpack的版本是^4.36.0 || ^5.0.0。

而当前项目中的webpack版本是4.28.4,低于4.36.0,因此不满足要求。

sass-loader@10.1.1 与项目中已安装的 webpack@4.28.4 版本不兼容)

npm error code ERESOLVE
npm error ERESOLVE could not resolve
npm error
npm error While resolving: sass-loader@10.1.1
npm error Found: webpack@4.28.4
npm error node_modules/webpack
npm error   peer webpack@"^4.0.0" from @intervolga/optimize-cssnano-plugin@1.0.6
npm error   node_modules/@intervolga/optimize-cssnano-plugin
npm error     @intervolga/optimize-cssnano-plugin@"^1.0.5" from @vue/cli-service@3.5.3
npm error     node_modules/@vue/cli-service
npm error       dev @vue/cli-service@"3.5.3" from the root project
npm error   peer webpack@"^4.0.0 || ^5.0.0" from @soda/friendly-errors-webpack-plugin@1.8.0
npm error   node_modules/@soda/friendly-errors-webpack-plugin
npm error     @soda/friendly-errors-webpack-plugin@"^1.7.1" from @vue/cli-service@3.5.3
npm error     node_modules/@vue/cli-service
npm error       dev @vue/cli-service@"3.5.3" from the root project
npm error   19 more (@vue/cli-plugin-babel, @vue/cli-plugin-eslint, ...)
npm error
npm error Could not resolve dependency:
npm error peer webpack@"^4.36.0 || ^5.0.0" from sass-loader@10.1.1
npm error node_modules/sass-loader
npm error   dev sass-loader@"10.1.1" from the root project
npm error
npm error Conflicting peer dependency: webpack@5.99.9
npm error node_modules/webpack
npm error   peer webpack@"^4.36.0 || ^5.0.0" from sass-loader@10.1.1
npm error   node_modules/sass-loader
npm error     dev sass-loader@"10.1.1" from the root project
npm error
npm error Fix the upstream dependency conflict, or retry
npm error this command with --force or --legacy-peer-deps
npm error to accept an incorrect (and potentially broken) dependency resolution.

尝试解决:npm uninstall sass-loader

但此时npm install sass-loader@8 --save-dev 执行时还是有问题(原因sass-loader@8.0.2也需要webpack@^4.36.0 || ^5.0.0,而我们的webpack是4.28.4(低于4.36.0),所以仍然不满足)

pm error code ERESOLVE
npm error ERESOLVE could not resolve
npm error
npm error While resolving: jnpf-web@3.4.1
npm error Found: webpack@4.28.4
npm error node_modules/webpack
npm error   peer webpack@"^4.0.0" from @intervolga/optimize-cssnano-plugin@1.0.6
npm error   node_modules/@intervolga/optimize-cssnano-plugin
npm error     @intervolga/optimize-cssnano-plugin@"^1.0.5" from @vue/cli-service@3.5.3
npm error     node_modules/@vue/cli-service
npm error       dev @vue/cli-service@"3.5.3" from the root project
npm error   peer webpack@"^4.0.0 || ^5.0.0" from @soda/friendly-errors-webpack-plugin@1.8.0
npm error   node_modules/@soda/friendly-errors-webpack-plugin
npm error     @soda/friendly-errors-webpack-plugin@"^1.7.1" from @vue/cli-service@3.5.3
npm error     node_modules/@vue/cli-service
npm error       dev @vue/cli-service@"3.5.3" from the root project
npm error   19 more (@vue/cli-plugin-babel, @vue/cli-plugin-eslint, ...)
npm error
npm error Could not resolve dependency:
npm error dev sass-loader@"8" from the root project
npm error
npm error Conflicting peer dependency: webpack@5.99.9
npm error node_modules/webpack
npm error   peer webpack@"^4.36.0 || ^5.0.0" from sass-loader@8.0.2
npm error   node_modules/sass-loader
npm error     dev sass-loader@"8" from the root project
npm error
npm error Fix the upstream dependency conflict, or retry
npm error this command with --force or --legacy-peer-deps
npm error to accept an incorrect (and potentially broken) dependency resolution.

 

  解决:

先 npm uninstall sass-loader

再npm install sass-loader@7.3.1 --save-dev

查阅sass-loader的版本历史:

- sass-loader v7.x 支持 webpack 4 (包括早期版本)

- 根据错误信息,sass-loader@8.0.2需要webpack>=4.36.0,所以如果我们用7.x版本,可能就可以兼容webpack4.28.4。

注意: 

不要使用 --force 或 --legacy-peer-deps:这会导致依赖树混乱,可能在运行时崩溃

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:http://www.pswp.cn/bicheng/85501.shtml
繁体地址,请注明出处:http://hk.pswp.cn/bicheng/85501.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

常见误区解读之三:超融合只适合外围/轻量业务场景,无法承载数据库等关键业务?

作者:SmartX 金融团队 祝志刚 在前两期“超融合常见误区解读”中,我们分别解读了如何以超融合建云并进行大规模部署。而对于生产业务场景,部分行业用户和业界人士可能还会有这样的认知: “超融合管理简单、成本也低,…

Kafka重平衡机制深度解析:原理、触发条件与应对策略

引言 在Kafka分布式消息系统中,重平衡(Rebalance)是一个至关重要的机制,它确保消费者组中的各个消费者实例能够公平地分担主题分区的消费任务。然而,重平衡过程也可能带来短暂的消费停顿和性能波动,处理不…

使用 Docker Compose 安装 Milvus(单机版)

1. 创建专用目录并进入 mkdir milvus-standalone && cd milvus-standalone 2. 下载 docker-compose.yml 文件 使用官方提供的配置文件(以 Milvus v2.3.3 为例): wget https://github.com/milvus-io/milvus/releases/download/v2.3…

【MySQL篇05】:事务的 ACID 性(数据库原理篇)

文章目录 一、事务的ACID特性二、数据库原理例题与 ACID 特性判断三、拓展(undolog 与 redolog) 一、事务的ACID特性 综述: 原子性(Atomicity):事务是不可分割的最小操作单元,要么全部成功&…

crawl4ai 框架的入门讲解和实战指南——基于Python的智能爬虫框架,集成AI(如NLP/OCR)实现自动化数据采集与处理

一、crawl4ai 框架简介 1. 框架定位 核心功能:基于Python的智能爬虫框架,集成AI(如NLP/OCR)实现自动化数据采集与处理 关键特性: 零配置快速启动(自动识别网页结构) 内置反反爬机制&#xff…

受够垃圾翻译!CodeBuddy 8 分钟造神器,划词秒翻 + 自动适配所有网页

本文所使用的 CodeBuddy 免费下载链接:腾讯云代码助手 CodeBuddy - AI 时代的智能编程伙伴 前言 作为一个天天泡在 GitHub 上扒项目的人,翻译问题简直是我 “挖宝” 路上的头号绊脚石!想研究国外大神的优质开源项目,不是被机翻软…

零基础设计模式——总结与进阶 - 2. 反模式

第五部分:总结与进阶 - 2. 反模式 (Anti-Patterns) 在软件开发中,我们追求良好的设计模式以构建健壮、可维护的系统。然而,同样存在一些常见的、导致不良后果的解决方案,这些被称为“反模式”。理解反模式,可以帮助我…

音视频流媒体高级开发-学习路线

原文作者:Linux 原文链接:音视频流媒体高级开发-学习路线 如果你想往音视频方向发展,那么本文一定要认真阅读~ 大家都知道音视频开发薪资高、门槛高、发展空间大,心里蠢蠢欲动,却不知道怎么入门,怎么进阶…

LINUX 通过rsync同步 免密备份

1,增加免密码用户密码 useradd backup echo "5566777" | passwd --stdin backup echo "backup ALL(ALL) ALL" >> /etc/sudoers # 源服务器操作 ssh client_usersource_server ssh-keygen -t rsa # 一路回车 ssh-copy-id serv…

在使用 HTML5 的 <video> 标签嵌入视频时,有时会遇到无法播放 MP4 文件的问题

原因分析: 只能播放声音,却无法播放视频。这通常是由于视频编码格式不兼容导致的。虽然 MP4 是一种常见的视频格式,但它包含多种编码方式,并非所有编码方式都受 HTML5 支持。 解决方案: 确认视频编码格式: …

【bugfix】记一次Spring Boot 配置层级错误导致数据库连接失败

前言:为什么你的数据库配置读不到? 在 Spring Boot 项目中,配置文件的层级(prefix) 是决定属性能否被正确解析的核心因素。一个看似微小的缩进错误,可能导致整个应用的数据库连接失败、服务启动异常&#…

wpf 队列(Queue)在视觉树迭代查找中的作用分析

文章目录 队列(Queue)在视觉树迭代查找中的作用分析示例代码一、队列的核心作用1. 替代递归的迭代机制2. 实现广度优先搜索(BFS) 二、队列的工作流程1. 初始化阶段2. 处理循环 三、队列操作的详细步骤查找过程分解: 四、为什么使用队列而不是其他数据结构1. 与栈(St…

快手数据开发面试SQL题:取窗口内排名第一和排名倒数第一的作为两个字段输出

目录 问题描述 样例数据表 sales 解决方案 第三步:使用条件聚合将多行合并为单行输出" 步骤1:计算排名的中间结果 中间结果输出: 步骤2:最终查询(处理并列情况) 最终输出结果: 关键点解释: RANK() OVER (PARTITION BY group_id ORDER BY amount DESC):…

第十六届蓝桥杯国赛(2025)C/C++B组 蓝桥星数字 独家解析

这题我中午是12点以后开始做的,只剩下1个小时了,12点50的时候完成了框架,但是细节总是实现不对,现在晚上来复盘的时候才把这题A出来了。 但是,就像高考的导数你整个思路都会,你死在了求导上。。。&#xf…

Google 的 Protocol Buffers 介绍

Protocol Buffers(简称 Protobuf)是由 Google 开发的一种高效、灵活、跨语言的数据序列化协议,广泛用于网络通信、分布式系统、持久化存储等场景。 一、什么是 Protocol Buffers? Protocol Buffers 是一种结构化的数据交换格式,类似于 XML 和 JSON,但更小、更快、更简单…

犀思云Fusion WAN与阿里云NIS深度融合,实现端到端智能可观测

随着“AI数智化”浪潮逐步深入行业,企业网络的复杂与故障感知日渐凸显。如何实现网络的高效运维、智能诊断与全域可视化管理,已成为企业上云的核心挑战。 近日,犀思云与阿里云达成深度产品级合作,将阿里云网络智能服务&#xff0…

基于gec6818的环境监测系统设计

一、设计要求 将环境中温湿度数值、环境的光照强度和烟雾的信息获取到开发板,显示在图形界面上。当温度值高于阈值时,温度指示灯变红、蜂鸣器告警并且启动直流电机正转降温;当湿度值高于阈值时,湿度指示灯变红、蜂鸣器告警并且继电器吸合接通…

c++中std::transform详解和应用代码示例

std::transform 是 C 标准库中非常常用的算法之一&#xff0c;属于 <algorithm> 头文件。它的作用是将一个&#xff08;或两个&#xff09;序列中的元素通过某个函数进行变换&#xff0c;并将结果输出到另一个序列中。 一、std::transform 作用总结 std::transform 支持…

Yolov5 使用

1.开发背景 在已有的 Conda 环境下实现目标检测标定。 2.开发需求 实现演示例子的图片标定。 3.开发环境 Ubuntu20.04 Conda Yolov5 4.实现步骤 4.1 安装环境 # 创建环境 python 版本建议 3.9 以上 conda create -n yolov5 python3.9# 进入环境 conda activate yolov5# …

资深Java工程师的面试题目(四)性能优化

以下是针对Java性能优化的面试题&#xff0c;涵盖前后端技术栈的常见优化方式&#xff0c;适合评估候选人对性能调优的理解和实际应用能力&#xff1a; 1. JVM性能调优 题目: 请说明JVM垃圾回收&#xff08;GC&#xff09;的常见类型及其适用场景&#xff0c;并描述如何通过J…