解决:Cannot resolve "swiper/dist/css/swiper.css"
一·问题描述:
(1)做《谷粒学苑》整合前端页面时,执行“npm run dev”命令时报这个异常
(2)初始配置如下图:
(3)在“node_modules/swiper/”目录下,根本就没有css/swiper.css这个文件。
二·问题原因:
(1)直接原因:安装swiper时执行的npm命令是:“npm install swiper”这个命令是默认安装最新版的。结果官方在更新的时候,对原本的文件架构做了一些调整。这就导致我们出现了这个问题
(2)根本原因:swiper安装的版本与我们项目中的配置不适应
三·解决办法:本人采用的是降低版本方法,当然网上也存在使用新版本的修改配置文件的解决方法
(1)先卸载swiper插件:
#卸载命令:
npm uninstall swiper
(2)更换swiper插件版本:安装5.2.0版本(老师视频使用的版本)
#安装swiper插件5.2.0版本命令:
npm install swiper@5.2.0 --save
(3)保持原有配置不改变,再次启动项目:此时你才能看到swiper目录结构发生改变,且报错消失
#启动项目命令:
npm run dev
(4)结果如下图所示:相应目录下面出现css文件,异常也消失
四·友情链接:
解决:Cannot resolve vue-awesome-swiper/dist/ssr
https://blog.csdn.net/weixin_48033662/article/details/122770023