こんにちは、クリエイティブSecの長谷川です。
本日は表題の通り、NPMでパッケージを公開してみた話をしたいと思います。

恥ずかしながら、長いこと技術者をやってきた割に
GitHub上でパブリックリポジトリを作成したり、npmにパッケージを公開してみたりと
いわゆるオープンソースな何かを作って公開したことがありませんでした。

なので、趣味で作っているアプリで必要となって作成したライブラリを
今回はNPMのパッケージ化を作成して、公開してみました。

作成したパッケージについて

以下が実際に私が作成して公開したものです。

vue3-read-more
npm : https://www.npmjs.com/package/@lazgram/vue3-read-more
GitHub : https://github.com/ShunsukeHasegawa/vue3-read-more

パッケージの内容は、長文のテキストに対して、最初の複数行だけ表示して
「もっと読む」をクリックすると全体が表示されるという、よくあるものになります。

npmで類似のパッケージを探したときに、いくつか出てきたのですが
Vue.js等のバージョンの問題なのか、正しく動作しなかったため、今回作成して公開してみました。

実際に動いているサンプルは以下のページで確認できます。
https://shunsukehasegawa.github.io/vue3-read-more/

公開にあたって苦労したこと

自分だけのためのものを作るのであれば、README.mdなどは適当で良いのですが
パブリックで公開するとなると、そうは行きません。

利用者が分かりやすいような内容を書いたり
npmのパッケージに含めるpackage.jsonなどもきちんと書かないといけないのですが
如何せん、作法がわかりませんでした・・・・。

なので、他のパッケージを参考にしたり、デモページを作成したりなど
個人用では考えもしなかった作業がありました。
先のサンプルページもそうなのですが、実はGitHub Pagesを使ったこともなかったので、いろいろな初体験がありました。

最後に

初めて作ったオープンソースのパッケージですが
npmで確認してみると、5月8日～14日の週で17件ダウンロードされていました。
初版を公開したのが5月12日だったので、実質3日間での実績となります。

件数が多いか少ないかは置いておいたとしても、誰かに利用してもらったというのがとても嬉しく感じました。

個人的にはコラボレーターやコントリビューターとして他の方にも参加してもらい
より良いものにしていけたらなという思いも出てきました。

また、オープンソースの何かを作って公開するというのが
楽しいものだとも感じたので、これからも何かを作って公開していけたらと思います。

それでは、今回はこのへんで。