Awesome npm

npmを扱う資料や関連プロジェクトをまとめたAwesomeリストです。

目次

• 記事
• ツール
• パッケージ
• クライアント
• ヒント
• FAQ
• コミュニティ
• ドキュメント
• サポート
• 関連

記事

• Small focused modules
• Unix philosophy and Node.js - 一つのことを行い、それをうまく行うプログラムを書く。
• Writing small modules
• Semver: A Primer (必読!)
• Semver: Tilde and Caret
• Offline installation of npm packages
• Task automation with npm run
• How to use npm as a build tool
• Install npm packages globally without sudo on macOS and Linux
• Optimizing the footprint of an npm package
• The Art of Node - Node.jsとnpmによるクライアントサイド開発の入門。
• Why npm scripts? - 一般的なパッケージとスクリプト、およびボイラープレートプロジェクトを含むnpm scripts入門。

ツール

Web

• npms - 多数の指標を用いてパッケージ品質を深く分析する優れたパッケージ検索。
• NodeICO - パッケージバッジ。
• Libraries.io - パッケージ発見。
• npm-stat - パッケージの統計グラフ。
• npmgraph - 依存関係の可視化。
• npm trends - 時間経過に伴うパッケージダウンロード数を比較する。
• npm-top - ダウンロード数別のnpmユーザー。
• npm semver calculator - semver範囲に一致するパッケージのバージョンを視覚的に調べる。
• ghub.io - npmパッケージのGitHubリポジトリへリダイレクトする。
• moiva - パッケージを発見・比較する。
• npmx.dev - npmレジストリ用の高速でモダンなビューアー。

ブラウザー拡張機能

• Octo-Linker - GitHub上のnpmパッケージ間を簡単に移動するChrome拡張機能。
• npm-hub - GitHubリポジトリ上のnpm依存関係を調べるChrome拡張機能。
• github-npm-stats - GitHub上でnpmのダウンロード統計を表示する。
• npm-search-update - 依存関係をすばやく検索し、npmレジストリの変更を監視するChrome拡張機能。

CLI

• zsh-better-npm-completion - npm向けのより良いZSH補完。
• npkill - 古くて容量の大きいnode_modulesフォルダーを簡単に見つけて削除する。

パッケージ

公開

• np - より良いnpm publish。
• publish-please - 安全かつ洗練された形でパッケージを公開する。
• npm-release - 子猫でもできそうなほど簡単にnpmへのリリースを行う。
• pkgfiles - パッケージで公開されるすべてのファイルを一覧表示する。
• release-it - Gitリポジトリおよび／またはnpmパッケージのリリースを自動化する。変更履歴生成、GitHub/GitLabリリースなど。
• semantic-release - 完全自動のパッケージ公開。

レジストリ

• npm-name - パッケージ名がnpmで利用可能か確認する。
• package-json - npmレジストリからパッケージのpackage.jsonを取得する。
• latest-version - npmパッケージの最新バージョンを取得する。
• npm-keyword - 特定キーワードを持つnpmパッケージの一覧を取得する。
• npm-user - npmユーザーの情報を取得する。
• npm-email - npmユーザーのメールアドレスを取得する。
• npm-user-packages - npmユーザーのパッケージを取得する。
• dpn - ユーザーのnpmパッケージの依存元を取得する。
• npm-stats - npmレジストリからデータを取得する。
• npm-cli-login - npmへログインする。
• nrm - レジストリマネージャー。
• npm-register - npmレジストリとプロキシを簡単に設定・保守する。
• verdaccio - 軽量なプライベートnpmプロキシレジストリ。
• cloudsmith - パブリックおよびプライベートnpmレジストリ（その他多数）をサポートする完全管理型パッケージ管理SaaS。
• RepoFlow - クラウドとセルフホストの両方で利用できる、シンプルで使いやすいパッケージ管理プラットフォーム。

その他

• npm-home - パッケージのnpmページを開く。
• gh-home - パッケージのGitHubページを開く。
• david - パッケージ依存関係が古くなっていないか確認する。
• npm-check - 古い、不正な、未使用の依存関係を確認し、対話的に更新する。
• npm-upgrade - 古いnpm依存関係を対話的に更新する。
• npm-shrinkwrap - 一貫性のあるshrinkwrapツール。
• npm-windows-upgrade - Windows上のnpmをアップグレードする。
• generator-nm - npmパッケージの雛形を生成する。
• package-up - 最も近いpackage.jsonファイルを見つける。
• read-package-up - 最も近いpackage.jsonファイルを読み取る。
• normalize-package-data - パッケージメタデータを正規化する。
• package-config - 最も近いpackage.jsonから名前空間付き設定を取得する。
• npm-run-path - グローバルインストール済みのものと同じように、ローカルインストール済みバイナリを名前でターミナル実行する。
• local-npm - npmをオフラインで使う。
• npe - package.jsonのプロパティを調査・編集するCLI。
• engine-deps - Node.jsバージョン固有の依存関係を簡単に管理する。
• enpeem-search - npmウェブ検索をスクレイピングしてパッケージを検索する。
• npm-issues - すべてのパッケージの既知のissueを一度に検索する。
• john - npm3のフラットな依存関係を見つけて並べ替えやすくする。
• ntl - npmタスクを一覧・実行する対話型CLIメニュー。
• decheck - コマンドラインでnpmパッケージの依存関係を調べる。
• shrinkpack - 依存関係を固定し、オフラインでインストールする。
• redrun - package.jsonのスクリプトを展開して実行速度を改善する。
• package-size - npmパッケージのバンドルサイズを取得する。
• synp - yarn.lockとpackage-lock.jsonを相互に変換する。
• npm-run-all - 複数のnpm-scriptsを並列または直列に実行するCLIツール。
• onchange - ファイルやフォルダーを監視し、変更時にコマンドを実行する。
• cli-error-notifier - npmスクリプトが失敗したときにネイティブデスクトップ通知を送る。
• luna - npm依存関係を管理するアプリ。
• emma-cli - 対話型CLIパッケージ検索ユーティリティ。
• lockfile-lint - 悪意あるパッケージ注入と安全でないlockfileリソースを軽減するため、セキュリティと信頼ポリシーを改善するlockfileをlintする。

クライアント

• yarn - 高速で信頼性が高く安全な依存関係管理。
• npm - 公式クライアント。
• pnpm - 高速でディスク容量効率のよいパッケージマネージャー。

ヒント

npmを最新バージョンへ更新する

$ npm install --global npm

Windowsユーザーは詳細を参照。

コマンドエイリアス

• npm i → npm install
• npm i -D → npm install --save-dev
• npm t → npm test
• npm it → npm install && npm test
• npm r → npm uninstall
• npm un → npm uninstall
• npm up → npm update

シェルエイリアス

よく使うnpmタスクを高速化します。

.zshrc/.bashrc内:

alias ni='npm install'
alias nid='npm install --save-dev'
alias nig='npm install --global'
alias nt='npm test'
alias nit='npm install && npm test'
alias nk='npm link'
alias nr='npm run'
alias ns='npm start'
alias nf='npm cache clean && rm -rf node_modules && npm install'
alias nlg='npm list --global --depth=0'

インストール時にpackage.jsonへ追加しない

デフォルトではnpmはインストールしたパッケージをpackage.jsonのdependenciesフィールドへ追加します（v5以降）。--no-saveフラグを指定すると防げます。パッケージをdevDependenciesへ追加するには--save-dev/-Dを使えます:

$ npm install --save-dev ava

スクリプトを実行する

package.jsonの"scripts"フィールドへ追加してnpm run <script-name>を実行すれば、npmで簡単にスクリプトを実行できます。利用可能なスクリプトを確認するにはnpm runを実行します。ローカルインストール済みパッケージのバイナリはPATHで利用できるため、名前で実行できます。

{
	"name": "awesome-package",
	"scripts": {
		"cat": "cat-names"
	},
	"dependencies": {
		"cat-names": "^1.0.0"
	}
}

$ npm run cat
Max

すべてのpackage.jsonプロパティは、環境変数として公開されます:

{
	"name": "awesome-package",
	"scripts": {
		"name": "echo $npm_package_name"
	}
}

$ npm run name
awesome-package

コマンドへオプションを渡す

以下の例のように-- --flagを追加すると、npmスクリプトで使うコマンドへオプションを渡せます。--はオプション解析の終端を示すため、npm runはこれを無視してコマンドへ渡します。

{
	"name": "awesome-package",
	"scripts": {
		"xo": "xo",
		"xo:fix": "npm run xo -- --fix",
	}
}

-- --fix オプションの追加は、xo --fixの実行に相当します。

Silentオプション

npm runには、npmスクリプトを組み合わせる際に特に便利な--silentオプションがあります。

次のようにJavaScriptファイルをlintする設定をしているとします:

{
	"name": "awesome-package",
	"scripts": {
		"xo": "xo",
		"xo:fix": "npm run xo --silent -- --fix",
	}
}

--silentオプションを使うとターミナル出力を減らせます。比較を参照してください。

ライフサイクルスクリプト

npmには、package.jsonで定義されると特定の条件で実行される、あらかじめ定義済みのライフサイクルスクリプトがあります。

{
	"name": "awesome-package",
	"scripts": {
		"prepublishOnly": "nsp check"
	},
	"devDependencies": {
		"nsp": "^3.0.0"
	}
}

これは、依存関係に既知の脆弱性がないか確認するため、npm publishでnpmパッケージをレジストリへ公開する前に自動実行されます。

注: prepublishOnlyはnpm v4.0.0以降で利用できます。npmドキュメントを参照してください。

npm startとnpm test

npm startとnpm testもライフサイクルスクリプトですが、自動実行はされません。

{
	"name": "awesome-package",
	"scripts": {
		"start": "node server.js",
		"test": "ava"
	},
	"devDependencies": {
		"ava": "^1.0.0"
	}
}

したがって、次のように簡単に実行できます:

$ npm test
$ npm start

preおよびpostスクリプト

これらは、スクリプトを順に自動実行するために使用できる特別なライフサイクルスクリプトです。

{
	"name": "awesome-package",
	"scripts": {
		"pretest": "eslint .",
		"test": "ava"
	},
	"devDependencies": {
		"eslint": "^4.19.0",
		"ava": "^1.0.0"
	}
}

$ npm test

これはテスト実行前にファイルをlintします。lintが失敗するとテストは実行されません。より一般的には、順に実行されるいずれかのスクリプトが0以外の終了コードで終了すると、その後のスクリプトは実行されません。

注: preとpostスクリプトはカスタムnpmスクリプトにも使えます。そのため、定義されていればnpm run fooはprefooとpostfooも実行します。

npxでスクリプトを実行する

npmには、パッケージバイナリを実行するツールnpxがv5.2.0以降同梱されています。各コマンドはローカルのnode_modules/.binディレクトリまたは中央キャッシュから実行され、<command>の実行に必要なパッケージはインストールされます。

{
	"name": "awesome-package",
	"dependencies": {
		"cat-names": "^1.0.0"
	}
}

バイナリがすでにインストール済みなら、node_modules/.binから実行されます。

$ npx cat-names
Max

バイナリがなければ、先にインストールされます。

$ npx dog-names
npx: installed 46 in 3.136s
Bentley

異なるNode.jsバージョンでコマンドを実行する

npx（npm v5.2.0以降に同梱）とnode-binパッケージを使うと、nvm、nave、nのようなバージョンマネージャーを使わずに、異なるNode.jsバージョンでコードを簡単に試せます。

$ npx [email protected] -- node --version
v6.11.0

ローカルパッケージをリンクする

パッケージのローカル版を依存関係として使うと便利な場合があります。npm linkを使うと、あるローカルパッケージを別のパッケージへリンクできます。使用したいパッケージでnpm linkを実行するとグローバル参照が作成されます。次に元のパッケージへ移動し、npm link <package-name>を実行して他方のパッケージをリンクします。

$ cd rainbow
$ npm link
$ cd ../unicorn
$ npm link rainbow

これでrainbowをunicornパッケージ内の依存関係として使用できます。

GitHubからパッケージをインストールする

npmはGitHubリポジトリから直接パッケージをインストールする短縮表記をサポートします:

$ npm install sindresorhus/chalk

mainブランチは変動するため、特定のコミットを指定します:

$ npm install 'sindresorhus/chalk#51b8f32'

コミットSHA、ブランチ、タグ、または何も指定しないことができます。

semverを使ってGit依存関係をインストールすることもできます: (npm v5以降が必要)

$ npm install 'sindresorhus/chalk#semver:^2.0.0'

パッケージの特定バージョンをインストールする

$ npm install [email protected]

最上位にインストールされたパッケージとバージョンを一覧表示する

$ npm ls --depth=0

コマンドのヘルプ

コマンドのヘルプドキュメントを取得します:

$ npm help <command>

例:

$ npm help install

パッケージのスタンドアロン版

Browserify化されブラウザーで利用できるパッケージのスタンドアロン版を素早く取得します。

https://wzrd.in/standalone/<package-name>[@<version>]

例:

• https://wzrd.in/standalone/object-assign
• https://wzrd.in/standalone/[email protected]

プロトタイピングには最適ですが、本番ではファイルをダウンロードするかBrowserifyを自分で使ってください。

FAQ

• node_modulesとshrinkwrapのどちらをチェックインすべきか
• Bowerとnpmの違いは何か
• package.jsonのバージョニングで^は何を意味するか
• インストール済みnpmパッケージのバージョンを見つける
• package.jsonにおけるdependencies、devDependencies、peerDependenciesの違いは何か

コミュニティ

• #npm on Freenode
• Stack Overflow
• Reddit
• Twitter
• Blog

ドキュメント

• Official
• Troubleshooting
• Semantic versioning
• Fixing npm permissions
• package.json
• npm run script
• Stats API

サポート

• npm.community
• Twitter
• Contact form

関連

• awesome-nodejs