Cookie の使用について.本サイトでは、基本機能の提供に必要な必須 Cookie を使用しています。さらに、同意いただいた場合に限り、アクセス解析 Cookie を利用して利用状況を把握し、サービス改善に役立てます。詳しくは .
このツールが役に立ったら、開発者にコーヒーを奢ってください ☕
主要なJavaScriptライブラリのCDNリンクをすばやく検索。読み込みコードをワンクリックでコピーして、フロントエンド開発を効率化できます。
https://cdn.jsdelivr.net/npm/react@18.3.1/umd/react.production.min.js<script src="https://cdn.jsdelivr.net/npm/react@18.3.1/umd/react.production.min.js"></script>import * as React from "https://esm.sh/react@18.3.1";よく使うJavaScriptライブラリのCDN一覧は、フロントエンド開発で定番のJavaScriptライブラリと、そのCDNリンクをまとめたオンラインリソースです。CDN(コンテンツ配信ネットワーク)なら、世界各地のサーバーからライブラリファイルを配信できるため、ページの読み込みを高速化できます。ファイルをローカルにダウンロードしなくても、<script> タグを1行コピーするだけでプロジェクトに導入できます。
ページを開くと、検索ボックスとライブラリ一覧が表示されます。次の方法で必要なライブラリをすばやく見つけられます。
代表的な2つのライブラリを例に、使い方を紹介します。
例1:jQuery 3.7.1 を読み込む
検索ボックスに「jQuery」と入力すると、複数のバージョンが表示されます。バージョン3.7.1を見つけて右側の「コピー」をクリックすると、次のリンクを取得できます。
<script src="https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js"></script>このコードをHTMLファイルの <head> タグ内に貼り付けると、ページ内で $ 記号を使用できるようになります。
例2:Vue 3.4.0 を読み込む
「Vue」を検索し、バージョン3.4.0を選んでリンクをコピーします。
<script src="https://cdn.jsdelivr.net/npm/vue@3.4.0/dist/vue.global.prod.js"></script>貼り付け後はVueのグローバルオブジェクトを利用できます。ブラウザの開発者ツールのコンソールで Vue.version と入力すると、正しく読み込めたか確認できます。
ページ上部の検索ボックスに必要なライブラリ名を入力して、ぜひ試してみてください。