通过包调用的swiper不能正常使用

Question

通过调用包，除了可以实现滑动设置其他属性不起作用； 通过html标签引入，可以正常实现。请问是为什么？// index.html<!-- Swiper --><div class="swiper-container">  <div class="swiper-wrapper"> ... </div>  <!-- Add Pagination -->  <div class="swiper-pagination"></div></div>// main.jsimport 'swiper/dist/css/swiper.min.css';import Swiper from 'swiper';var mySwiper = new Swiper('.swiper-container', {    pagination: '.swiper-pagination' // 分页条并不会出现})然而// index.html<link rel="stylesheet" href="./swiper.min.css"><div class="swiper-container">  <div class="swiper-wrapper"> ... </div>  <!-- Add Pagination -->  <div class="swiper-pagination"></div></div><script src="./swiper.min.js"></script>//mian.jsvar mySwiper = new Swiper('.swiper-container', {    pagination: '.swiper-pagination' // 分页条可以显示})

Answer 1

这两个地方引用的并不是同一个文件，如果通过import引入，则为swiper.module.js文件，于是你需要进行ES6/7的编译转化才能正常使用。