如何在项目中添加轮播插件工具（CRM）

在项目中，我们有时候不需要自己去写大量代码去完成一个功能块，可以利用别人做好的功能块加以修改形成自己需要的功能块,这种技术叫做CRM （copy-run-modify）。以一个轮播功能为例子，展示如何实现的。

这是别人做好的轮播工具网站https://swiperjs.com/demos#navigation

1、进入 Swiper 官网

Swiper 官网

2、安装 Swiper
点击页面的Get Started，查看安装流程
（1）、选择用npm安装（需要下载文件到本地）

2.png

（2）、推荐用CDN使用（一般使用CDN较好，不用下载文件到本地）

3.png

2、初始化Swiper

4.png

初始化这里配置可以修改成自己需要内容，如轮播方向，是否要滚动条等等内容。

这时候可以在浏览器控制台中打印出Swiper对象，说明引用成功

5.png

3、在页面引入 Swiper（HTML）

6.png

其中代码中的Slide1、2、3就是轮滑三个画面，可以根据自己需要添加更多画面和图片导入来源。

4、在页面引入 Swiper（CSS 和 JS）

7.png

5、运行（CRM 中的 Run）
6、修改 HTML（CRM 中的 Modify）、修改 CSS、修改 JS
7、最后变成自己需要的轮播功能块

完整代码以上传到github