vue使用swiper 安装好的swiper找不到dist目录解决办法

今天想在vue项目使用swiper，按官网操作使用安装，但安装好的swiper包显示没有dist这个目录。
各种找原因发现是因为安装的版本过高默认为最新版本。
解决办法：
1：首先去node_modules文件下删除swiper文件包。
2：接下来再次安装需要指定swiper版本

 npm install swiper swiper@3.4.2 --save-dev

3:再次打开会发现 dist文件出现了

然后就可以在页面引入并使用了

import Swiper from "swiper"
import "自己的路径/swiper/dist/css/swiper.css";

页面

<div class="swiper-container" style="height:20vh">
      <div class="swiper-wrapper">
        <div class="swiper-slide" style="color:#000">Slide 1</div>
        <div class="swiper-slide" style="color:#000">Slide 2</div>
        <div class="swiper-slide" style="color:#000">Slide 3</div>
      </div>
    </div>

具体swiper配置请参考官网

export default {
mounted() {
    new Swiper(".swiper-container", {
      pagination: {
            el: ".swiper-pagination"
            },
            loop: true,
            autoplay: {
                delay:3000,
                stopOnLastSlide: false,
                disableOnInteraction: false
            },
            observeParents:false,   //注意这里！！
            observer:true, //也要注意这里！！
    });
  }
}