[laravel] [npm] Я не могу использовать ошибку swiper Uncaught TypeError: Swiper не является конструктором - PullRequest
Новая
       15

[laravel] [npm] Я не могу использовать ошибку swiper Uncaught TypeError: Swiper не является конструктором

0 голосов
/ 16 января 2020

Сегодня я пытаюсь использовать swiper, но он не работает.

Я устанавливаю Swiper с npm

npm install swiper

, это мой код

index.blade. php 

<div class="swiper-container">
    <div class="swiper-wrapper">

        <div class="swiper-slide">
            <div class="card">
                <img src="..."
                     class="card-img-top" alt="...">
                <div class="card-body">
                    <div class="card-text">
                        <h5 class="float-left"><b>Phi Phi Island</b></h5>
                        <h6 class="float-right">Id : 12001</h6>
                        <br><br>
                        <p>This is a wider card with supporting text below as a natural
                            lead-in to
                            additional content. This content is a little bit longer.</p>
                        <hr>
                        <div>
                            <div class="float-left">Adult</div>
                            <div class="float-right">200</div>
                            <br>
                            <div class="float-left">Child</div>
                            <div class="float-right">100</div>
                            <br>
                            <div class="float-left">Infant</div>
                            <div class="float-right">0</div>
                        </div>
                    </div>
                </div>
                <div class="card-footer text-center">
                    <button type="button" class="btn btn-outline-danger">See detail
                    </button>
                </div>
            </div>
        </div>
    </div>
    <div class="swiper-pagination" slot="pagination"></div>
    <div class="swiper-button-prev" slot="button-prev"></div>
    <div class="swiper-button-next" slot="button-next"></div>
</div>

Это скрипт 

$(document).ready(function () {
            var swiper = new Swiper('.swiper-container', {
                slidesPerView: 3,
                spaceBetween: 30,
   });
});

app. js 

window.Swiper = require('swiper');

app.s css

@import "~swiper/swiper.scss";

Итак, я запускаю npm уже запущен dev .

результат равен 

VM3130 app.js:31708 Uncaught TypeError: Swiper is not a constructor
    at HTMLDocument.<anonymous> ((index):556)
    at mightThrow (VM3130 app.js:31415)
    at process (VM3130 app.js:31483)

Я пишу код swiper js .com, но не работает, пожалуйста, помогите мне! !

1 Ответ

0 голосов
/ 16 января 2020

Мое решение

в приложении. js

window.Swiper = require('swiper/js/swiper');
...