【Javascript】公開したライブラリ・パッケージのCDN作成方法

Posted at 2024-04-11

はじめに

初めまして。エンジニアのkeita_Maxです。

以前ライブラリをnpmに公開する記事を書いたのですが、それをCDNとして読み込むようにするにはどうしたらいいのだろうと調べた結果を書きます。

JSDELIVERというものがあるらしいです。

これはNPMに公開しているものなら何でもCDNとして読み込みことができるようなので、実際にやってみました。

// load any project hosted on npm
https://cdn.jsdelivr.net/npm/package@version/file

公式にはこのように書いてありました。

package@versionここに自分のパッケージの名前とバージョンを記載し、file部分には読み込みたいファイル名を記載します。

実際にやってみます。

https://www.npmjs.com/package/keitamax-flowing-js

この間公開したパッケージで試してみます。

packageがkeitamax-flowing-js
versionが0.0.3
fileがindex.cd.js

です。

これでURLを作ってみると以下のようになります。

https://cdn.jsdelivr.net/npm/keitamax-flowing-js@0.0.3/index.cd.js

こちらに実際にアクセスしてみると、

このように読み込めていることがわかります。

とくにリリースしなくてはいけないことなどはなく、簡単にできました。

この記事での質問や、間違っている、もっといい方法があるといったご意見などありましたらご指摘していただけると幸いです。

最後まで読んでいただきありがとうございました！