node.jsでslickを使いたい

前提・実現したいこと

node.js初心者です。
webサイトにslickでスライドショーを入れたいのですが、
動かないです。
どうしたらいいか教えていただきたいです。
宜しくお願い致します。

発生している問題・エラーメッセージ

Uncaught TypeError: $(...).not(...).slick is not a function
    at HTMLDocument.<anonymous> (mv.js:3)
    at j (jquery.min.js:2)
    at k (jquery.min.js:2)

該当のソースコード

html
1
2<head>
3:
4:
5    <link rel="stylesheet" href="./assets/css/style.css" />
6</head>
7:
8:
9<body>
10:
11:
12        <ul class="slider">
13          <li class="slider-item slider-item1"></li>
14          <li class="slider-item slider-item2"></li>
15          <li class="slider-item slider-item3"></li>
16        </ul>
17:
18:
19        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"> 
20        </script>
21        <script src="./assets/js/script.js"></script>
22    </body>
23
24</html>

javascript
1import $ from 'jquery';
2import 'slick-carousel';
3
4$(function(){
5  $(".slider").not('.slick-initialized').slick({
6    fade:true,//切り替えをフェードで行う。初期値はfalse。
7    autoplay: true,//自動的に動き出すか。初期値はfalse。
8    autoplaySpeed: 3000,//次のスライドに切り替わる待ち時間
9    speed:1000,//スライドの動きのスピード。初期値は300。
10    infinite: true,//スライドをループさせるかどうか。初期値はtrue。
11    slidesToShow: 1,//スライドを画面に3枚見せる
12    slidesToScroll: 1,//1回のスクロールで3枚の写真を移動して見せる
13    pauseOnFocus: false,//フォーカスで一時停止を無効
14    pauseOnHover: false,//マウスホバーで一時停止を無効
15  });
16});
17//スマホ用：スライダーをタッチしても止めずにスライドをさせたい場合
18$(function(){
19  $('.slider').on('touchmove', function(event, slick, currentSlide, nextSlide){
20    $('.slider').slick('slickPlay');
21  });
22});

試したこと

https://flex-box.net/slick-npm/
こちらのサイトを見てやってみたのですが、うまくいきません。
どうしたらいいか教えていただきたいです。
宜しくお願い致します。

補足情報（FW/ツールのバージョンなど）

Lhankor_Mhy

2021/06/16 01:58

エラーメッセージにmv.jsとjquery.min.jsがあるようですが、これらを読み込んでいる部分をご提示いただけますか？

mosha

2021/06/16 04:26

javascript の$(function(){　～の部分からmv.jsとなっております。 jquery.min.jsの部分は、htmlを追加いたしました。宜しくお願い致します。

Lhankor_Mhy

2021/06/16 05:00

> javascript の$(function(){　～の部分からmv.jsとなっております。 import～は別のファイルなのですか？

mosha

2021/06/16 05:11

そちらの部分は、script.jsに書いていまして、 import $ from 'jquery'; import 'slick-carousel'; import { mv } from './modules/mv'; このような形でscript.jsに書いています。 import $ from 'jquery'; import 'slick-carousel'; ↑の部分はmv.jsに書いたほうが良いのでしょうか？

Lhankor_Mhy

2021/06/16 05:26

いえ、jQuery のプラグインを読んだ後に jQuery を読み込むと、プラグインが無効になるのです。 jQuery を複数実行しているようなので、その実行順が気になっただけです。