Ratchakrit
Ratchakrit

Reputation: 41

TypeError: Swiper is not a constructor

I'm trying to get Swiper to work but it always throw me an error "Swiper is not a constructor"

I'm using http://idangero.us/swiper/get-started/#.WMsuihJ96MI as the Swiper library and installed this library as a meteor package.

client/body.js

Template.slider.onRendered(function(){
     var mySwiper = new Swiper ('.swiper-container', {

     // Optional parameters
     direction: 'vertical',
     loop: true,

     // If we need pagination
     pagination: '.swiper-pagination',

     // Navigation arrows
     nextButton: '.swiper-button-next',
     prevButton: '.swiper-button-prev',

     // And if we need scrollbar
     scrollbar: '.swiper-scrollbar',
  });
});

client/body.html

<body>
   <h1>Test</h1>
 {{> slider }}
</body>

 <template name="slider">
   <!-- Slider main container -->
 <div class="swiper-container">
     <!-- Additional required wrapper -->
     <div class="swiper-wrapper">
         <!-- Slides -->
         <div class="swiper-slide">Slide 1</div>
         <div class="swiper-slide">Slide 2</div>
         <div class="swiper-slide">Slide 3</div>
     </div>
     <!-- If we need pagination -->
     <div class="swiper-pagination"></div>

     <!-- If we need navigation buttons -->
     <div class="swiper-button-prev"></div>
     <div class="swiper-button-next"></div>

     <!-- If we need scrollbar -->
     <div class="swiper-scrollbar"></div>
 </div>
</template>

Upvotes: 4

Views: 16092

Answers (2)

Andrei Shekhau
Andrei Shekhau

Reputation: 11

In my case i fixed it by changing import {Swiper, SwiperOptions} from "swiper"; to import Swiper, {SwiperOptions} from "swiper";

Upvotes: 0

Praveen Pandey
Praveen Pandey

Reputation: 51

@mutdmour You should try Swiper.default(element,options)

Make sure to console you Swiper instance and check if, It's really a constructor or it's an object which has it's constructor in it's property. Sorry if I give a wrong info. Because my english is very weak and this is my first reply to a Forum.

Upvotes: 5

Related Questions