解決
index.liquidの最後尾にslick.min.jsおよびslick用の自作JSを設置することで解決した
使用しているテーマはデフォルトではなく購入テーマ
shopify slick で検索してみれば、先駆者様方が情報を出してくれている。
しかし、今回は同じようにやっても出来なかった。
原因について究明はしていないが恐らく購入したテーマに入っている何かと競合していると思われる。
※本当は究明したほうがいいのだろうけど、そこが難しい...言い訳だがタスクに追われているので今回は見逃し
※こういうの究明方法どうしたらいいんだろうか。そこも学ばなくてはいけない。
今回slickを使いたいページはTOPページのみであるため、
index.liquid だけ適用されれば良いので、layout/theme.liquidに固執する必要はない。
というわけで、色々と試行錯誤。
Shopify Slickの場合に言われている内容は基本的に<head>内に書く事だが、
競合してうまく動かない場合は結局のところ、</body>直前に書く方が安全であるということ。
つまり、普通にHTMLで使う時と同様にJquery自体の読み込みは<head>でやるが、
slick.min.jsやslickを動かすために設定した自作のjsファイルは</body>直前におく事で解決した。
具体的にいうと今回の対象（slickを使って動かしたいの）はindex.liquidのみなので、
index.liquidの最後尾にslick.min.jsおよびslick用の自作JSを設置することで解決した。
最終構成
実際は、sectionに作るがとりあえず動いたところまで。
templates/index.liquid
{% comment %}
例なのでコメントアウト
<ul class="slider">
<li><img src=".png" alt=""></li>
<li><img src=".png" alt=""></li>
<li><img src=".png" alt=""></li>
<li><img src=".png" alt=""></li>
<li><img src=".png" alt=""></li>
</ul>
{% endcomment %}
{{ 'slick.min.js' | asset_url | script_tag }}
{{ '自作slick.js' | asset_url | script_tag }}
layout/teheme.liquid
{% comment %} 色々あるけど下記以外は省略 {% endcomment %}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
{{ 'slick.css'| asset_url | stylesheet_tag }}
{{ '自作slick.css'| asset_url | stylesheet_tag }}
ここに時間をかける、相も変わらず無能である