vue 项目中使用 vue-awesome-swiper 轮播插件

1. 安装less-loader    npm install less less-loader --save

2.安装 css-loader      npm install css-loader --save

以上两个是该插件的依赖,不安装run的时候会报错

3.安装vue-awesome-swiper  npm install vue-awwsome-swiper --save

4 在main.js中引入

import VueAwesomeSwiper from 'vue-awesome-swiper'

import 'swiper/dist/css/swiper.css'

Vue.use(VueAwesomeSwiper)

5.组件使用

6.修改build\webpack.base.conf.js文件,添加下面代码  (这一步我没有做,没有报错,作为记录,遇到了错误提示可以使用)

  {

        test: /\.less$/,

        loader: 'style-loader!css-loader!less-loader'

      }

7.其中遇到了ESlint规则一堆报错 eslint-disable-next-line to ignore the next line. Use /* eslint-disable */ to ignore all warnings in a file. ”

可以挨个挨个的改正这个错误,也可以在build/webpack.base.conf.js文件中,注释或者删除掉:module->rules中有关eslint的规则


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。