Как подключить слайдер из модуля в js файл на странице?

Question

[Stepan1998]

Есть слайдер https://swiperjs.com/get-started
Делаю $ npm install swiper
В мой js файл который был подключен в index.html пишу

import Swiper from 'swiper';
  import 'swiper/css';

  const swiper = new Swiper(...);

Но он ругается, что так подключить нельзя
Как мне его подключить исходя из того, что я этот слайдер скачал модулем?

Comments

[Антон Горецкий]

Покажите что у вас в файле package.json Каким сборщиком компилируете проект?

[Stepan1998]

Антон Горецкий, без сборщика
Просто хотел скачать на сервер слайдер и подключить его

[Ankhena]

Stepan1998,

Просто хотел скачать на сервер слайдер и подключить его

Так скачайте как обычно и подключите как обычно.

Answer 1

[Антон Горецкий]

Тогда это вам не нужно

Делаю $ npm install swiper

Чтобы подключить этот модуль к вашему HTML-файлу нужно использовать этот код из документации

<link rel="stylesheet" href="https://unpkg.com/swiper@8/swiper-bundle.min.css" />

<script type="module">
  import Swiper from 'https://unpkg.com/swiper@8/swiper-bundle.esm.browser.min.js'

  const swiper = new Swiper(...)
</script>

Если хотите подключать в свой скрипт (как написали в своем примере) - то используйте сборщик webpack или parcel, Иначе запутаетесь и замучаетесь в модулях.