vue2-3安装swiper轮播图

在vue2中

swiper所有版本中swiper4的兼容性是最好的,组件在 swiper4之后没有很大改变,使用时最好选择swiper4。

npm install [email protected] --save-dev
或者
cnpm install [email protected] --save-dev

安装完成可以去package.json中去查看是否安装完成

"dependencies": {
    "core-js": "^3.8.3",
    "element-ui": "^2.15.9",
    "font-awesome": "^4.7.0",
    "swiper": "^4.5.1",
    "vue": "^2.6.14",
    "vue-router": "^3.5.1",
    "vuex": "^3.6.2"
  },

证明已经安装完成

接下来是引用
在main.js写入

import 'swiper/dist/css/swiper.min.css'
import 'swiper/dist/js/swiper.min'

如果要是不确定文件得位置,可以打开node_module文件夹会找到类似于下面图的目录


image.png

接下来在组件中使用


 

 

 

样式自己调吧,这只是简单的引入swiper

vue3 之前写的还没整理,下回再写吧

你可能感兴趣的:(vue2-3安装swiper轮播图)