Cannot resolve “swiper/dist/css/swiper.css“

有一天，我在快乐的学习谷粒学院，跟着老师走，不料发生错误：
Cannot resolve “swiper/dist/css/swiper.css“
如图：
根据大佬的讲解可知：
引入NUXT vue-awesome-swiper 插件出错 Cannot resolve “swiper/dist/css/swiper.css“_OY-CSDN博客
哦是swiper的版本问题：

在 package.json 查看自己的swiper版本：

是版本过高的缘故；

一、可以直接降低版本：

Cannot resolve “swiper/dist/css/swiper.css“_江～仔的博客-CSDN博客
也就是：
1.

npm install swiper swiper@3.4.2 --save-dev

下完后在次运行： npm run dev

紧接着又出现
These dependencies were not found:

原来是我的静态资源asset未导入
2. 再次运行：
不出意料仍然报错：
未发现依赖：
vue-awesome-swiper/dist/ssr

3. 突然想起来nuxt-swiper-plugin.js 页面：正好导入了该依赖：

4. 不过为什么 VueAwesomeSwiper 不是紫色的
（这就是Webstorm的好处hhh）
然后我重新导入之


5.
还有个错误

参考：
Vue整合swiper报错Could not compile template …swiper\dist\css\swiper.css解决办法 - 等不到的口琴 - 博客园 (cnblogs.com)

如图：如果遇到了就加上

再重启：

诶，好了

值得一提的是，

如果遇到一些在网上找不到的问题，
比如这次的：
Package subpath './dist/css/swiper. css' is not defined by "exports"

这个报错一直解决不了，没必要一直耗下去，重新来一遍；
因为一开始他就是 Cannot resolve “swiper/dist/css/swiper.css“，可以很好的解决；
但我没有认真对待： 将别人操作步骤硬搬过来，结果仍然报错，且没有将别人操作步骤删掉（即没有退回到问题的原状态）；就使得问题变得更加复杂。
一步错，步步错。然后问题就砍不动了。
因此；在解决bug时，时时刻刻对此时解决的问题状态、步骤进行备份和记录（就像虚拟机的快照），方可对bug有更好的把控。