npxコマンドとは？ 何ができるのか？
はじめに
Nuxt.jsのプロジェクトを作成する際に、公式ドキュメントを読みながら進めていたのですが。
$ npx create-nuxt-app <project-name>
という記述があり、おなじみのinstallコマンドみたいな何かという勝手な認識だけで進めていました。
しかし、何回かプロジェクト作成を繰り返す中で、「npxコマンド」について理解していないことに気づき、調べてみたところ便利だと感じたためまとめてみます。
間違っている部分もあるかと思われますので、ご指摘いただけると幸いです。
What？ npx
npxコマンドはnpmバージョン5.2.0より同梱されているコマンドで、ローカルインストールしたコマンドを実行するために使われます。npmのバージョン5.2.0がリリースされたのは、今から約3年ほど前になるため、今主に使われているnpmではほとんど使える状態にあります。
npxが使える状態であえて使わないのはもったいないに便利なので是非使っていきたいコマンドの１つです。
もしnpxコマンドが存在しない場合は。
$ npm install -g npx
でグローバルにインストールできます。
Why？ npx
なぜ、npx コマンドなのでしょうか。
npmを使ってプロジェクトを作成、初期化するコマンドは以下の通りです。
$ npm init <project-name>
これはnpmを使いプロジェクトを管理配下へ置くために必要なpackage.jsonを生成します。
npmを使ってスクリプトを実行するためにはpackage.jsonのscriptsへ予めスクリプトを定義しておく必要があります。
"scripts": {
"dev": "nuxt",
"build": "nuxt build",
"start": "nuxt start",
"generate": "nuxt generate"
},
上記はcreate-nuxt-appで作成したプロジェクトから抜粋。
しかしnpxコマンドを使うことでインストールされていないコマンドであっても自動的に探してインストール、実行まで行ってくれます。
実行したあとはパッケージの除去まで行ってくれるため、環境が汚れる心配はないそうです。
インストールするまでも無いけど手軽に試したい、環境を汚したくないそんなニーズにぴったりだと感じました。
How Use？ npx
npxコマンドの基本的な使い方は次のとおりです。
インストール済みモジュールの実行
$ npx <インストール済みモジュール名>
インストールしていないモジュールを実行(実行後に自動削除)
$ npx <未インストールのモジュール名>
GitHub リポジトリを指定して実行
$ npx github:<リポジトリ名>
GitHubのリポジトリを直接指定して実行もできるのが便利ですね。
npxコマンド実行が実行されるとローカル内で指定されたNodeモジュール格納パスの探しに行き、見つからない場合はインターネット上から探して自動的にインストールするようです。
実行したNodeモジュールは実行後に自動的に削除されるため、環境を大きく汚すことはありません。
前程挙げたNuxt.jsのプロジェクト作成コマンドをもう一度見てみます。
$ npx create-nuxt-app <project-name>
つまりプロジェクトを作る際、create-nuxt-appというモジュールを実行することで各モジュール間の依存関係を解決しながらプロジェクトを作成できるというイメージです。
Nuxt.jsを使ったプロジェクトはスクラッチで１から始めることもできますが、create-nuxt-appを使うことで簡単に始められるのは大きなメリットだと感じます。
まとめ
npxコマンドを使うことで、インストールせずともスクリプトの実行が簡単に行えることが分かりました。
普段何気なく叩いているコマンド1つでも意味が分かると点と点がつながるようにプログラムへの理解がぐっと深まるように感じます。
「百聞は一見にしかず」
最後まで読んでいただきありがとうございました。
Discussion