JSライブラリの公開にはnpが便利

以前 いまどきのJavaScriptライブラリ開発という記事を公開した。その後、npというツールの存在を知って僕のライブラリ公開プロセスが少し変わったので、今回はそれを紹介したいと思う。


クールなnpm publishのためのツール np

npを使えば以下ライブラリ公開前のチェックやnpmへのpublish、gitへのtag付けを自動で行ってくれる。

  • gitにcommitされてない変更はないか
  • ブランチはmasterかどうか
  • testの実行
  • npmへのpublish
  • gitのtag付け
  • masterへのpush

npmにはpublishしてたけど、gitへのtag付けを忘れていたとか、間違ってfeatureブランチからpublishしてしまったとかそういったミスを防げる。

優れたUI

さらにnpを使えば、ライブラリの公開までにどんなコマンドが実行されているのか可視化されていて安心感がある。


npm scriptsを途中で実行する

またpackage.jsonに書かれたnpm scriptsも代わりに実行してくれる。テストの際にはnpm testを、公開前には npm prepublish, 公開後には npm postpublishなど。
npm scriptsについては下のリンクを参考にしてほしい。


僕の場合は下のソースのように、publish前に一度、スタンドアロンで使えるようにjsをbuild & minify しておきたいので'prepublish'というコマンドを登録している。

 "scripts": {
  ...
  "prepublish": "npm run build:js && git add -A && git commit -m \"bumping version\"",
  "deploy": "np --no-cleanup"
 },

npmの公開時に意識すべきこと

npはgitへのtag付けやtest、gitへのタグ付けはやってくれるが、その他にも考慮すべきことはある。例えば、公開されたパッケージの容量。容量が多いとnpm install時にユーザーが場合によっては数分も待たされることがある。npmに公開されているパッケージの場合は最悪、ユーザーがBrowserifyやWebpackなどでrequireして使えればいいので必要なファイルはそんなにない。極論、mainのJavaScriptファイルと、package.jsonくらいだ。以下の2つをしっかり確認するだけで、容量はかなり抑えられる

  • .npmignore
  • dependenciesとdevDependenciesの整理

.npmignore

npmへの公開時はなるべくパッケージのインストール容量が大きくならないように.npmignoreを書いておくのもおすすめ。これがないと、プロジェクトに含まれる、すべてのファイルがnpmに公開される。 .npmignoreがプロジェクトにないと、.gitignoreが代わりに参照される。gitでは管理したいけど、npmでは公開したくないファイル類はここに書く必要がある。ちなみに以下が、あるプロジェクトのために作った.npmignore。

node_modules
docs/
webpack.config.js
webpack.config.prod.js
yarn.lock
.eslintrc
.node-version
.editorconfig
.gitattributes
.node-version

dependenciesとdevDependenciesの整理

dependenciesとdevDependenciesの整理も大事だ。dependenciesにたくさんの依存ライブラリが記述されていると、それも同時にダウンロードされるのでインストールの遅延の原因になる。dependenciesには公開したいライブラリがrequireしているパッケージだけでいい。

以上。いいnpライフを!!


堀 悟大

アップルップル フロントエンドエンジニア。2014年高知大学理学部卒業。学生時代にHTML5のCanvas要素を使ってゲームを作っていたことでWeb全般に興味をもつ。アップルップル入社後はa-blog cmsを便利に使うための機能の実装や、HTML5の技術を使ったデジタルサイネージの実装を行う。趣味は英語。読むことも話すことも好き。

Home