CDNサービス UNPKG から Swiper の JSとCSSを読み込んで利用していたスライダーが突然動かなくなった時に確認したこと。
UNPKGの稼働確認
UNPKG のURL “https://unpkg.com/” にアクセスして表示出来るか確認。
読み込んでいるJSとCSSを直接ブラウザから参照してみる
表示確認したところ以下の内容が返ってくるだけで、JSとCSSのソースは返ってきませんでした。
https://unpkg.com/swiper/css/swiper.min.css
Cannot find "/css/swiper.min.css" in swiper@6.0.4
https://unpkg.com/swiper/js/swiper.min.js
Cannot find "/js/swiper.min.js" in swiper@6.0.4
動かなくなったコード
<link rel="stylesheet" href="https://unpkg.com/swiper/css/swiper.min.css">
<script src="https://unpkg.com/swiper/js/swiper.min.js"></script>
正常に動くコード
<link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css">
<script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
原因
原因は単純でそれぞれのパスが変わっていた..だけだったのですが、こういうことが一度でもあるとCDNを利用することがちょっと怖いなと思ってしまいますね。
メリットとデメリットをしっかり把握した上で上手く使って行きたいですね!
コメント