npm と npx の違いについて個人的に調べていて参考になった記事を雑に和訳しました。
もとになった記事はこちらです。
npm vs npx
もし Node.js を使ったことがある人なら、必ず npm を使ったことがあるはずです。
npm (node package manager) は、Node.js をインストールするとすぐに利用できる依存性+パッケージのマネージャーです。npm は、開発者がグローバルおよびローカルにパッケージをインストールする方法を提供します。
時々は、あるパッケージを見て、いくつかのコマンドを試してみたいと思うかもしれません。しかし、依存関係のあるパッケージを（あなたの）ローカルフォルダー node_modules にインストールしないと、試してみることはできません。
そこで npx の出番です。
この記事では、npm とnpx の違いを見て、両方を使いこなす方法を紹介します。
まず、npm とはなにか、それを使って何ができるのかを理解しましょう。読み物の助けにビデオを見てみませんか？
youtube です。動画を見なくても、読み進めることはできます。
npm the package manager
npm にはいくつかの特徴があります。まず何より、オープンソースである Node.js を公開するためのオンラインリポジトリである、ということです。
つぎに、パッケージをインストールして、バージョンや依存関係を管理するための CLI ツールです。npm には何十万もの Node.js ライブラリーやアプリケーションが登録されており、毎日多くのパッケージが追加されています。
npm はそれ自信では、パッケージを実行しません。npm を使ってパッケージを実行するためには、package.json ファイルで実行するパッケージを指定する必要があります。
実行ファイルが npm パッケージ経由でインストールされると、npm はリンクを作成します：
グローバルインストールの例 Linux: /usr/local/bin Windows: %AppData%/npm
npm でパッケージを実行するには、次のようにローカルパスを入力する必要があります：
$ ./node_modules/.bin/your-package
または、package.json ファイルの scripts セクションにつぎのような内容を追加します：
{ "name": "your-application", "version": "1.0.0", "scripts": { "your-package": "your-package" } }
それから、スクリプト npm run を実行します：
npm run your-package
プレーンな npm を使ってパッケージを実行するためには、（あらかじめに）たくさんの儀式が必要なことがわかります。
ありがたいことに、ここで npx が役にたちます。
npx the package runner
npm のバージョン 5.2.0 以降、npm には mpx がプリバンドルされています。そのため、現在では大方の標準となっています。
npx は npm レジストリーにホストされた依存関係を簡単にインストールして、管理することを目的とした CLI ツールでもあります。
通常は npm でインストールするような Node.js ベースの実行ファイルをとても簡単に実行できるようになりました。
以下のコマンドを実行すると、現在の npm バージョンにこのツールがインストールされているかどうかを確認することができます：
$ which npx
もしも、npx がインストールされていなければ、以下のコマンドでインストールします：
$ npm install -g npx
インストールを確認したら、npx が役立つユースケースをいくつか見てみましょう。
Run a locally installed package easily（ローカルにインストールされたパッケージを簡単に実行する）
ローカルにインストールされたパッケージを実行したいときは、以下のようにタイプするだけです：
$ npx your-package
npx は $PATH またはローカルプロジェクトのバイナリーに <command> または <package> が存在するかどうかを確認して、存在するときは実行します。
Execute packages that are not previously installed（インストールされていないパッケージを実行する）
別の大きなアドバンテージは、前もってインストールしていないパッケージを実行できることです。
$ npx cowsay wow
時々 CLI ツールで使いたいけど、グローバルにインストールしたくない、といったときにこの使い方は素晴らしいものです。
つまり、ディスクスペースを節約しつつ必要なときだけツールを実行することができます。また、グローバル変数の汚染も少なくなります。
Run code directly from GitHub（GitHub から直接コードを実行する）
これはかなりいいです。
npx を使えば、あらゆる GitHub の gist やリポジトリーを実行することができます。ここでは、GitHub gist を実行することにフォーカスしてみましょう。
最も基本的なスクリプトは、メインの JS ファイルと package.json
ファイルで構成されます。ファイルをセットアップしたら、あとは、gist へのリンクを実行するだけです。
npx github-url
「ここで」例に使用したコードを見つけることができます。
悪意のあるコードによって起こる申告な問題を避けるため、実行する前にスクリプトを必ず注意深く読んでください。
Test different package versions（異なるパッケージのバージョンをテストする）
npx では、Node.js の異なるバージョンのパッケージやモジュールを簡単にテストすることができます。この素晴らしい機能をテストするために、create-react-app パッケージをローカルにインストールして、次期バージョンをテストしてみます。
このテストでは、出力の最後にいくつかの Dist タグが表示されます。Dist タグは、バージョンの番号のエイリアスを提供するもので、これによって入力がとても簡単になります。
$ npm v create-react-app
dist-tag を確認するコマンド（canary, latest, next）
npx を使って create-react-app の nextの Dist タグで、サンボックス ディレクトリーの中にアプリを作成してみます。
$ npx create-react-app@next sandbox
npx は next バージョンの create-react-app を一時的にインストールして、アプリをスキャフォールド（足場に）して、その依存関係をインストールします。
インストールすると、次のようにアプリをナビゲートし、起動することができます：
cd sandbox npm start
React のアプリが自動的にデフォルトブラウザーで開かれます。これで、next バージョンの create-react-app パッケージを実行できました。
まとめ
npx は、バージョン管理や依存関係の問題を回避して、ちょっと試してみたいだけのパッケージをインストールするときに役立ちます。
パッケージ、コマンド、モジュール、GitHub Gist やリポジトリーを実行する簡単な方法を提供します。
まだ npx を使ったことがない方は、今が使い始めるよいときです。
この記事は、「neutrondev.com」に掲載されたものです。
