Help us understand the problem. What is going on with this article?

npm 5.2.0の新機能! 「npx」でローカルパッケージを手軽に実行しよう

More than 1 year has passed since last update.

npmとはNode.jsインストール時に付属するパッケージマネージャーで、Node.jsのパッケージの管理や実行を取り扱うものです。

npmのバージョン5.2.0で導入された「npx」を用いると、下記のようにローカルにインストールしたnpmパッケージを、npxコマンドだけで実行できるようになります

webpac.gif

npxnpmにバンドルされているため、npxの個別インストールは不要です。

次のようにしてモジュールを実行できます。

npx (モジュール名)

従来のnpmの実行方法との比較

従来では、ローカルのnpmパッケージを使用するには、次のような方法が必要でした。

  • 方法1: ./node_modules/.bin/(パッケージ名)で実行する
  • 方法2: $(npm bin)/(パッケージ名)で実行する
  • 方法3: package.jsonにnpm-scriptsを記述して実行する

npxはいずれの方法よりも簡潔なコマンドで、パッケージを実行できます。実案件でタスクを共有する場合は方法3が望ましいですが、ちょっとした動作テストにはnpxが重宝するでしょう。

ちなみに、Facebook社製でnpmと互換性のあるパッケージマネージャーYarnでは、runコマンドでローカルのパッケージを実行できます(参考記事「npmから乗り換えてわかったYarnの4つのメリット - ICS MEDIA」)。

インストールしていないパッケージを一度だけ実行できる機能

ローカルにインストールしていないパッケージを、一度だけ実行できる機能もあります。

たとえば、ローカルにインストールしていないtypescriptパッケージを、一度だけ実行するには次のようにします。

コマンドが完了すると、インストールされたパッケージはグローバルから削除されるので、汚染の心配はありません(記事「Introducing npx: an npm package runner – Kat Marchán – Medium」より)。

パッケージを試したいけれど、わざわざフォルダーを作って、インストールして。。というのが煩わしい場合に便利です。下記は、cowsayyosaymosayという、コマンドライン上に文字列を出力するパッケージを試している例です。

ramen.gif

npxで快適なnpmライフを

開発をしていると、ローカルのnpmパッケージの挙動を試したいというケースは多くあります。これまでは$(npm bin)/(パッケージ名)やnpm-scriptsを使うという煩わしさがありましたが、npxの登場によって手軽になります。是非試してみてください。

参考記事「Introducing npx: an npm package runner – Kat Marchán – Medium

tonkotsuboy_com
ICSのインタラクションデザイナーです。「JavaScriptコードレシピ集」の著者。CSS Nite 2017・2018でベストセッションの1人に選出されました。 アプリ開発やWebページ制作が専門で、フロントエンドの情報を随時発信しています。猫の名前は「うに」です。九州大学芸術工学部音響設計学科出身。
https://ics.media
ics
インタラクションデザイン専門のプロダクション。最先端のウェブテクノロジーを駆使し、オンスクリーンメディアの表現分野で活動しています。最新のウェブ技術を発信するサイト「ICS MEDIA」を運営。
https://ics.media/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away