Проблемы с Slick Slider [Html Java]

Question

У меня проблемы с моим скользким слайд-шоу. Фотография действительно появляется, но она не будет скользить. Может кто-нибудь помочь мне с этой проблемой, пожалуйста?

Html файл:

В шапке:

<link
      rel="stylesheet"
      type="text/css"
      href="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css"
    />

Тело:

<div class="container-fluid p-0">
            <div class="site-slider">
              <div class="slider-one">
                <div>
                    <img src="./pictures/banner1.jpg" class="img-fluid" alt="Banner 1" />
                </div>
                <div>
                    <img src="./pictures/banner2-2702.jpg" class="img-fluid" alt="Banner 2" />
                </div>
                <div>
                    <img src="./pictures/banner3-2702.jpg" class="img-fluid" alt="Banner 3" />
                </div>
              </div>
              <div class="slider-btn">
                <span class="prev position-top"
                  ><i class="fas fa-chevron-left"></i
                ></span>
                <span class="next position-top right-0"
                  ><i class="fas fa-chevron-right"></i
                ></span>
              </div>
            </div>
          </div>

<script type="text/javascript" src="//cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>
<script src="./js/main.js"></script>

В файле Js:

$(".slider-one")
  .not(".slick-intialized")
  .slick({
    autoplay: true,
    autoplaySpeed: 3000,
    dots: true
  });