安装splide.js遇browser-sync与插件依赖冲突问题求助

API 探路者

2026-7-1

解决Laravel中Splide.js安装的ERESOLVE依赖冲突问题

核心问题拆解

你的问题出在browser-sync-webpack-plugin@2.3.0仅支持browser-sync@^2版本，但项目里装的是browser-sync@3.0.2，二者peer依赖不兼容；调整版本后出现的安全漏洞，用npm audit fix --force强制修复会强制回滚依赖，导致循环。

具体解决步骤

升级browser-sync-webpack-plugin到兼容3.x的版本
browser-sync-webpack-plugin从3.x版本开始支持browser-sync@3，直接升级该插件即可解决peer依赖冲突：
```
npm install browser-sync-webpack-plugin@^3.0.0 --save-dev
```
安装完成后再尝试安装splide.js：npm install @splidejs/splide
手动处理安全漏洞，避免强制修复
不要用npm audit fix --force，而是先查看具体漏洞详情：
```
npm audit
```
根据输出找到存在漏洞的依赖包，在package.json中添加resolutions字段锁定安全版本（npm需6.14+支持，若不支持可先安装npm-force-resolutions）：
```
"resolutions": {
  "存在漏洞的包名": "对应的安全版本号"
}
```
若使用npm-force-resolutions，先安装依赖：
```
npm install npm-force-resolutions --save-dev
```
然后在package.json的scripts中添加：
```
"scripts": {
  "preinstall": "npx npm-force-resolutions"
}
```
最后执行npm install即可应用安全版本。
应急绕过peer依赖冲突（临时方案）
如果暂时找不到完美兼容的版本组合，可以用旧的依赖解析逻辑忽略peer依赖警告安装splide：
```
npm install @splidejs/splide --legacy-peer-deps
```
注意：此方案可能带来潜在兼容性风险，但Splide与browser-sync无直接依赖，短期使用问题不大。
清理依赖缓存重置安装
若上述方法无效，清理缓存后重新安装：
```
npm cache clean --force
rm -rf node_modules package-lock.json
npm install
```