No day younger than today

RubyとかRailsとか蒙古タンメンとか

npmへのパッケージ公開方法

こんにちは!!
フィヨルドブートキャンプでWebエンジニアを目指してプログラミング習得に励んでいる@ふーがです。

bootcamp.fjord.jp

パッケージをnpmに公開する手順でしどろもどろしてしまったので、未来の自分が困らないようにメモを残しておきます。

npm Sign Upで登録する

npm Sign Upにアクセスすると、登録画面が表示されます。

f:id:fuga__ch:20210622194958p:plain

上から順に、ユーザー名・メールアドレス・パスワードを入力して、「Agree to the...」と書いてあるところのチェックボックスにチェックを入れます。
そして、「Create an Account」ボタンをクリックすると登録完了です。

登録ができたかを確認するために、ターミナルで次のコマンドを実行します。
npm loginコマンドを実行すると、ユーザー名やパスワードの入力を求められるので、さきほど登録時に入力したものを入力しましょう。

$ npm login
    npm notice Log in on https://registry.npmjs.org/
    Username: fu-ga
    Password: 
    Email: (this IS public) [Your EmailAddress]
    Logged in as fu-ga on https://registry.npmjs.org/.
$ npm whoami
    fu-ga

登録時に入力した情報が表示されれば、これでnpmのアカウント登録は完了です。

package.jsonを編集する

すでに公開したいパッケージのプログラムは完成している前提で、公開に最低限必要なことを書きます。

// package.json
{
  "name": "cheapest-books",
  "version": "1.0.0",
  "description": "By entering the ISBN of a book, you can list and compare the selling price on Amazon, DMM Books, and SEshop.",
  "main": "main.js",
  "bin": {
    "cheapest-books": "./main.js"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/FUGA0618/cheapest-books"
  },
  "author": "Fu-ga",
  "license": "MIT",
  "devDependencies": {
    "eslint-config-standard": "^16.0.3",
    "eslint-plugin-import": "^2.23.4",
    "eslint-plugin-node": "^11.1.0",
    "eslint-plugin-promise": "^5.1.0",
    "eslint-plugin-standard": "^5.0.0"
  },
  "dependencies": {
    "enquirer": "^2.3.6",
    "node-fetch": "^2.6.1",
    "puppeteer": "^10.0.0"
  }
}

中でも特に大切なのは、binの部分です。

これはコマンドを実行する際の名前とパスを指定しているもので、このライブラリであればターミナルで

$ cheapest-books

と入力すれば実行できるようにするためのものです。

READMEを作る

機能の紹介や使い方を説明するために作ります。 作っておくと、npmでも自動的にREADMEを読み込んでくれて、WEBサイト上で表示してくれます。

記載する内容としては、 - 説明文 - インストール方法 - 使い方

くらいが書いてあれば十分かと思います。 日本語でも英語でも良さそうですが、なんかカッコイイので英語にしましたw

公開する

ターミナルで以下のコマンドを実行すると公開されます。

$ npm publish
.
.
+ cheapest-books@1.0.0

最後の表示が出れば公開完了です。

試しに、npm searchで検索をしてみます。

$ npm search cheapest-books
NAME                      | DESCRIPTION          | AUTHOR          | DATE       | VERSION  | KEYWORDS
cheapest-books            | By entering the…     | =fu-ga          | 2021-06-21 | 1.0.0    |

package.jsonに設定した内容が、ちゃんと反映されているようですね。

インストールして使ってみる

公開が完了しているとすでにインストールできる状態になっているはずです。

$ npm i -g cheapest-books

package.jsonで設定したコマンドを実行して、ちゃんと起動すれば成功です。
試しにターミナルで使ってみます。

$ cheapest-books
? Please enter a ISBN ›

ちゃんと起動ができました。

まとめ

「npmに公開する」というとすごく難しそうなイメージを持ったのですが、やってみると意外とあっさり終わってしまった印象です。

しかし、いざ自分のターミナルでnpmコマンドを使ってインストールしてみると、「本当に公開されているんだなぁ…!」としみじみと実感して感慨深かったです。
しかもこれが全世界に公開されているなんて、考えただけでもスケールの大きい話ですよね。

何者でもない自分が、このようにして世界に発信できるというのも、プログラミングの楽しみの1つなのかもしれません。