npm と npx: 違いは何ですか?

Fimber Elemuwa 著✏️

JavaScript または Node.js を使用する場合、Node Package Manager である npm に遭遇したことがあるでしょう。これは、パッケージの管理、依存関係のインストール、および必要なライブラリでプロジェクトを最新の状態に保つための頼りになるツールです。しかし、npm にバンドルされている別のツールである npx もあり、これによりよく「この 2 つの違いは何ですか?

」という疑問が生じます。

一見すると、npm と npx はどちらも Node.js パッケージの操作に役立つように見えますが、目的は異なります。この記事では、npm と npx の主な違いを分析し、それらがどのように機能するかを示し、それぞれをいつ使用するかを検討します。

新しいプロジェクトを設定している場合でも、スクリプトを実行している場合でも、単に npm と npx をいつ使用するかについて知りたい場合でも、このガイドは両方のツールを理解し、それらを開発ワークフローにどのように組み込むことができるかを理解するのに役立ちます。

npmとは何ですか?

npm は Node Package Manager の略で、その名の通り Node.js パッケージを管理するツールです。プロジェクトに新しい「パッケージ」が必要になるたびに、npm を利用してインストールを支援します。これらのパッケージは、小さなユーティリティ関数から本格的なフレームワークやライブラリまで多岐にわたります。

しかし、npm はライブラリをインストールするためだけのものではありません。プロジェクトの依存関係やスクリプトの管理にも最適です。重大な変更を防ぐためにライブラリの特定のバージョンをロックする必要がある場合は、npm が対応します。また、package.json ファイル内でスクリプトを定義して、プロジェクトのテストやビルドなどの一般的なタスクを自動化することもできます。

npmの仕組み

npm をソフトウェア コンポーネントのデジタル ストアと考えてください。新しい Node.js プロジェクトを開始するときは、それを構築するためにさまざまなツールとライブラリが必要になります。車輪を再発明する代わりに、npm を使用して、これらの事前構築済みパッケージを取得してインストールできます。これは、それぞれに固有の名前とバージョンを持つパッケージの膨大なオンライン レジストリを維持することによって機能します。

npm install コマンドを使用すると、npm は指定されたパッケージとその依存関係をダウンロードし、node_modules という名前のローカル ディレクトリに配置します。このディレクトリは、すべてのプロジェクトの依存関係とバージョンが追跡される中心的な場所です。ローカル インストールとは、パッケージをインストールしたプロジェクト内でのみパッケージが使用できることを意味します。コマンドは次のようになります:

npm install <package-name>

たとえば、Cowsay ライブラリをプロジェクトに追加する場合は、次のように入力します。

npm install cowsay

このディレクトリはプロジェクトからアクセスできるようになり、コード内でパッケージの機能を使用できるようになります。グローバル インストールでは、システム全体でパッケージを利用できるため、どのプロジェクトでもパッケージを使用できます。これは、どこからでも実行したいコマンドライン ツールに便利です。

npm は、単純なパッケージのインストールだけでなく、各パッケージのバージョン管理も提供しており、必要な正確なバージョンを指定できます。これは、新しいバージョンでの重大な変更によって引き起こされる潜在的な問題を回避するために重要です。

さらに、npm は package.json 内でスクリプトを定義する方法を提供します。これらは、サーバーの起動、テストの実行、プロジェクトの構築などのタスクを自動化するコマンドです。 package.json では、次のようなスクリプトを定義できます:

npm install <package-name>

npxとは何ですか？

npx は npm v 5.2.0 で導入されました。 npm はパッケージのインストールと管理に関するものですが、npx はパッケージの実行に関するものです。

npx は、Node.js パッケージをインストールせずに実行できるクイック コマンド ランナーと考え​​てください。 npx は、パッケージを 1 回だけ使用する場合、またはシステムに永続的に追加せずにテストする場合に特に便利です。

npx が登場する前は、パッケージからコマンドライン ツールを使用したい場合は、まずそれをグローバルにインストールする必要がありました。 npx を使用すると、グローバル インストールを必要とせずに npm レジストリから直接ツールを実行できるため、これが簡素化されます。

npxの仕組み

npx でコマンドを実行すると、まずローカルの node_modules ディレクトリがチェックされます。パッケージがそこで見つかると、それが実行されます。そうでない場合、npx はパッケージを一時的にインストールし、実行してから削除します。これは、システムを乱雑にせずに幅広いツールを使用できることを意味します。

create-react-app を使用して新しい React プロジェクトを開始するとします。通常、最初にグローバルにインストールする必要があります:

npm install cowsay

次に、次のように実行します。

{
  "scripts": {
    "start": "node index.js",
    "test": "jest"
  }
}

しかし、npx を使用すると、グローバル インストールをスキップして直接実行できます。

npm install -g create-react-app

このコマンドは create-react-app をダウンロードして実行し、完了したら破棄します。これは高速かつ便利で、一度しか使用しないグローバル パッケージでシステムが乱雑になるのを防ぎます。

すでにプロジェクトにパッケージをローカルにインストールしている場合、npx を使用すると、node_modules への完全なパスを指定することなくパッケージを実行できます。たとえば、テストのために Jest をローカルにインストールした場合は、次のように npx を使用して実行できます。

create-react-app my-app

npx はローカルの node_modules フォルダー内のパッケージを自動的に検索して実行するため、時間と手間を節約します。

npx の最も優れた機能は、実行しようとしているパッケージまたはコマンドを把握できる機能だと思います。 3 段階のプロセスに従って、コマンドの実行方法を決定します。

• ローカルで確認する: npx はまず、パッケージがプロジェクトの node_modules フォルダーにローカルにインストールされているかどうかを確認します。パッケージが見つかった場合は、そこから実行します
• グローバルにチェック: パッケージがローカルに見つからない場合、npx はそれがシステムにグローバルにインストールされているかどうかをチェックします。パッケージがグローバルに見つかった場合は、それを実行します
• npm レジストリから取得: 最後に、npx がローカルまたはグローバルでパッケージを見つけられなかった場合、npm レジストリからパッケージを取得して実行し、実行後に削除します

注意、デフォルトでは、npx はパッケージの最新バージョンを実行しますが、特定のバージョンが必要な場合は、どのバージョンを実行するかを指定することもできます。

npm と npx の主な違い

npm と npx はどちらも Node.js エコシステムの重要なツールですが、異なるレベルで異なる役割を持っています。

Feature	npm	npx
Purpose and functionality	Primarily used for installing packages from the npm registry and managing dependencies in Node.js projects. It helps in adding, removing, and updating packages, and maintaining package versioning	Designed to execute Node packages directly without needing to install them globally. It allows users to run packages without cluttering the global or project-specific `node_modules`
Package installation	Installs packages locally or globally	Executes packages temporarily without installing them permanently
Temporary usage	Installation with npm persists until explicitly removed. Packages remain in `node_modules` or globally installed paths	Runs packages temporarily and discards them after execution unless otherwise specified
Usage	`npm install `	`npx `
Script setup	Requires modifications to `package.json` to create custom scripts	No modifications needed in `package.json` for running commands
Execution of CLI tools	Must install CLI tools globally or locally before using them	Can run CLI tools directly from the npm registry without prior installation
Project setup	Typically used for project setup involving multiple dependencies and versions.	Ideal for quick project scaffolding or one-time command execution, like `create-react-app`
Node.js compatibility	Bundled with Node.js for general project and package management	Included with Node.js starting from v 8.2.0, streamlining the execution of packages

結論: npm と npx のどちらを使用すべきか?

npm または npx をいつ使用するかは、タスクとプロジェクトのニーズによって異なります。

開発または運用にとって重要なプロジェクトの依存関係をインストールおよび管理する必要がある場合は、npm を使用する必要があります。 npm ではパッケージが package.json にリストされていることを保証するため、プロジェクト内のバージョン管理と一貫性を完全に制御できます。また、package.json で定義されたスクリプトを実行するための頼りになるツールでもあり、サーバーの構築、テスト、実行などのタスクに最適です。

一方、npx は、グローバルにインストールする必要のない、迅速な 1 回限りのコマンドやテスト ツールに最適です。 React プロジェクトをブートストラップするための create-react-app などのツールを 1 回だけ使用したい場合、npx を使用すると、システムを混乱させることなくツールを直接実行できます。フルパスを入力せずにローカルにインストールされたパッケージを実行する場合にも便利で、ワークフローが簡素化されます。つまり、長期的な依存関係管理には npm を使用し、一時的なタスクやオンザフライでパッケージを実行するには npx を使用します。

---

200 番台のみ ✔️ 本番環境で失敗したネットワーク リクエストや遅いネットワーク リクエストを監視します

ノードベースの Web アプリまたは Web サイトのデプロイは簡単です。 Node インスタンスがアプリにリソースを提供し続けるようにすることが、さらに困難になります。バックエンドまたはサードパーティ サービスへのリクエストが確実に成功することに興味がある場合は、LogRocket を試してください。

LogRocket は Web アプリ用の DVR のようなもので、文字通りサイトで起こっているすべてを記録します。問題が発生する理由を推測する代わりに、問題のあるネットワーク リクエストを集約してレポートすることで、根本原因を迅速に理解できます。

LogRocket は、ページの読み込み時間、最初のバイトまでの時間、遅いネットワーク リクエストなどのベースライン パフォーマンス タイミングを記録するためにアプリを計測し、Redux、NgRx、Vuex のアクション/状態もログに記録します。無料でモニタリングを始めましょう。

以上がnpm と npx: 違いは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。