vue中使用swiper出现Can't resolve 'swiper/dist/css/swiper.css'

在使用vue-awesome-swiper中出现Can't resolve 'swiper/dist/css/swiper.css'错误

百度各种文档找，都不行，基本都是说各种安装，但是又总是说的含含糊糊。

最终综合了好几个文档确定是swiper版本的问题。

一般在安装的时候都是使用这个命令

npm install swiper vue-awesome-swiper --save

默认就安装了vue-awesome-swiper的最新版本，我的是5.3.8.

然而在vuecli的工程下面\node_modules\swiper里面会发现没有dist目录，所以出现这个错。

目前因为没去研究，所以不知道swiper最新版5.3.8应该是怎么导入这个css，可能是不需要走dist这个目录。

 

百度各种文档写的都是npm去安装vue-awesome-swiper的命令。但实际在安装vue-awesome-swiper的时候，会自动安装一个swiper。

我开始以为是vue-awesome-swiper的版本太高，超过了项目代码的版本，就指定安装了vue-awesome-swiper@3.1.3

npm install swiper vue-awesome-swiper@3.1.3 --save-dev

结果依然不行。后来在package.json看了swiper的版本，才发现swiper尽管被我删除了。但是在安装vue-awesome-swiper@3.1.3的时候，仍然安装了swiper5.3.8版本。

最终解决方案是：

　　删除swiper目录

执行

npm install swiper swiper@3.4.2 --save-dev

swiper目录就出现了dist目录。

编译通过。正常。

有机会再看看swiper新版本是怎样。