どうも！かけちまるです！
ライブラリやプラグインを読み込むのに便利なCDN。
jQueryのように公式が提供している場合もありますが大体は検索して探さないとだと思います。
いちいち探すのが面倒な時に便利なCDNサービスのUNPKGをご紹介します。
この記事では、
がわかります。
UNPKGは、npmで公開されているパッケージを配信しているCDNサービスです。
npmで公開されているパッケージが使えるので、jQuery/gsap/Three.js/React/Vue.jsなど様々なライブラリやプラグインをUNPKGで読み込むことができます。
具体的には次のようにして読み込みます。
HTMLコピー<script src="https://unpkg.com/jquery@3.6.0/dist/jquery.min.js"></script>
まずは、該当ファイルを探してscriptタグで読み込む方法を説明します。
この記事では、Three.jsを読み込む想定で解説しています。
該当パッケージを検索
該当パッケージは、https://www.unpkg.com/パッケージ名/で探すことができます。
※パッケージ名の後に/を付けるのを忘れないこと
※検索すると最新バージョンにリダイレクトします。
パッケージ名がわからない場合は「npm Three.js」などで検索するとnpmの公式サイトから確認できます。
npm公式サイトの右上あたりでパッケージインストールの方法が書いてあるのでそこでパッケージ名を確認できます。
該当ファイルを探す
パッケージが検索できたらディレクトリが表示されると思います。
ここから読み込みたい該当ファイルを探します。
Three.jsの場合は、buildフォルダに入っていました。
※distかbuildフォルダに入っていることが多いと思います。
scriptタグで読み込む
該当ファイルを開き、右上あたりの”View Raw”ボタンをクリック。
あとは、URLをコピーしてscriptタグで読み込みます。
HTMLコピー<script src="https://unpkg.com/three@0.142.0/build/three.min.js"></script>
これで完了です！
おわり
フィードバックを送信
記事についてのフィードバックはTwitterかお問い合わせフォームから受け付けております。
