npmコマンド

Node.jsのプロジェクトを効率的に管理・構築する上で欠かせないツールが「npm（Node Package Manager）」です。npmは、JavaScriptのパッケージ管理を行うためのツールであり、Node.jsに標準で付属しています。世界中の開発者が作成した豊富なパッケージを簡単に利用できるだけでなく、自分のプロジェクト用に管理や公開を行うことも可能です。

この記事では、npmの基本的な使い方から、実際のプロジェクトで役立つコマンド一覧です。初心者の方はもちろん、既にnpmを利用している方にも新しい発見がある内容を目指しています。

インストール前の準備

npm -v | npm -version
バージョンの確認。
node -v
もしnpmが確認できなければnodeも確認してみるとよいでしょう。

パッケージの確認

npm list –depth=0 | npm ls –depth=0
ローカル。プロジェクト内のトップレベル依存パッケージを一覧表示します。
npm list –depth=0 -g | npm ls –depth=0 -g
グローバル。インストールされたトップレベルのパッケージを一覧表示します。
npm list | npm ls
ローカル。プロジェクト内のすべての依存パッケージ（トップレベル＋サブ依存パッケージ）をツリー形式で表示します。
npm list/ls パッケージ名
設定したパッケージがインストールされているか確認し、インストール場所やその依存状況を表示します。
npm info パッケージ名 versions
パッケージのバージョン情報（例：5.2.0、5.2.1）をnpmレジストリ（公式のnpmパッケージデータベース）から取得します。

初期化

npm init
初期化。package.json を対話形式で作成。
npm init -y
初期化。package.json を対話形式省略。

プロジェクトの作成

プロジェクトの作成が可能なパッケージの条件は下記になります。公式サイトからcreate-で検索をして調べることができます。

テンプレート名が「create-」で始まる
パッケージ名が create-<テンプレート名> の形式で登録されている必要があります。
CLIテンプレートとして設計されている
そのパッケージがスキャフォルディング（プロジェクト生成）用に設計されている必要があります。
npmレジストリに公開されている
対応するパッケージがnpmレジストリ上で利用可能である必要があります。

コマンド

npm create パッケージ名@latest/バージョン
テンプレートパッケージを使い、新しいプロジェクトを初期化するコマンド。
npm init パッケージ名@latest/バージョン
npm create と同じ動作

latestは最新の安定版です。またはバージョンを指定します。

インストールコマンド

npm install パッケージなし
プロジェクト作成済みの場合。node_modules に package.json に記載されたすべての依存パッケージをインストールします。
npm install パッケージ名@latest/バージョン
標準的なインストール方法。node_modules に追加し、package.json の dependencies に記載される。
npm i パッケージ名@latest/バージョン（本番＋開発環境）
上記と同じ。エイリアス簡略形。
npm add パッケージ名@latest/バージョン（本番＋開発環境）
上記と同じ。エイリアス簡略形。
–global | -g
パッケージをグローバルインストールする。他のプロジェクトやターミナルでどこからでも使用可能。
–production（本番環境用）
本番環境で使用する依存関係のみインストールし、devDependenciesを無視します。主にデプロイ時や本番サーバーでのセットアップ時に使用します。
–save | -S （本番＋開発環境）
package.json の dependencies フィールドに記載されます。–save オプションを明示的に指定する必要はなく、npm install コマンドのデフォルト動作として適用されます。
–save-dev（開発環境用）
開発中のみ必要な依存関係としてインストール。例として、テスト用ライブラリやビルドツールが挙げられます。devDependencies フィールドに記載されます。例: テストツール（例: jest）、リンター（例: eslint）。
ci（node_modulesをクリーンに）
package-lock.json に基づいてクリーンインストール。package.json との不一致がある場合はエラーを出す。モジュール破損時のクリーン再構築。開発中にインストールされた不要なモジュールや異なるバージョンを避ける。
–save-optional
オプショナル依存としてインストール。optionalDependencies に記載される。
–no-save
package.json に記載せず、一時的にインストール。
–global-style
すべての依存パッケージをフラットにインストール（従来の方法）。
–package-lock-only
依存関係のインストールはせず、package-lock.json を再生成。
–save-exact
正確なバージョンをインストールし、package.json に記載。

パッケージインストール後の確認

環境や依存関係の状態を確認する

npm config get prefix
npm のグローバルインストール先のディレクトリパスを取得します。
npm doctor
環境を診断し、問題点をチェック。

脆弱性やアップデートの確認

npm audit
脆弱性をチェックし、修正方法を提案。
npm audit fix
自動的に脆弱性を修正。修正可能なものだけが更新されます。修正できないものが残る場合があります
npm audit fix –force
自動的に脆弱性を修正。許可された範囲外も解決してくれます。しかし、互換性に影響を与える可能性があり多少リスクが伴いますので本番環境は慎重に。
npm outdated
アップデート可能なパッケージをリストアップ。

問題の解決と最適化

npm update
依存パッケージを最新バージョンに更新。
npm dedupe
重複する依存パッケージを整理して、node_modules の構造を最適化する。
npm rebuild
ネイティブモジュールなどを再構築する。

エラーが発生した場合に、以下の手順で問題を解決することをお勧めします。これはエラーの原因に応じた対処順序です。

npm audit：脆弱性や依存関係の問題を確認する。
npm audit fix：自動的に脆弱性を修正する。
npm dedupe：重複した依存パッケージを整理して、構造を最適化する。
npm rebuild：ネイティブモジュールや特定のパッケージを再構築する。
npm update：依存パッケージを最新バージョンに更新。

依然としてエラーが解決しない場合

rrmdir /s /q node_modulesでnode_modules を削除と npm install を実行再インストール。npm doctorで問題がないか確認。あってもgitがインストールされていないという、警告くらいなら問題ないです。

npx

npx とは

npm バージョン 5.2.0 以降に同梱されたコマンド。
ローカルまたは未インストールの Node.js モジュールを実行可能。
実行後に自動削除されるため、環境を汚さない。

npx の特徴

インストール済みモジュールの実行
- $ npx <モジュール名>
未インストールモジュールの一時実行
- $ npx <未インストールのモジュール名>
GitHub リポジトリから直接実行
- $ npx github:<リポジトリ名>

npx を使う理由

手軽に試せる
- インストール不要で試験的なモジュールを利用可能。
環境を汚さない
- 実行後にモジュールを削除。
プロジェクト作成が簡単
- 例: $ npx create-nuxt-app <project-name> で Nuxt.js プロジェクトを簡単作成。
- 例: $ npx create-next-app <project-name> で Next.js プロジェクトを簡単作成。

npx の活用場面

短期的なツールの利用やプロジェクト初期化に最適。
Nuxt.js、React、Vite などのプロジェクト作成に活用。

とめ

npx を使えば、モジュールの一時利用やプロジェクト作成が効率的に行える。
環境を汚さず、柔軟な使い方が可能。

npx と npm の活用で広がる Node.js 開発の可能性

Node.js のエコシステムを支えるツールである npm と npx は、それぞれの特性を活かすことで、効率的な開発を可能にします。npm は依存関係の管理やライブラリのインストールに欠かせない存在であり、npx は一時的なツールの実行やプロジェクトの迅速な初期化に役立ちます。これらのツールを活用することで、開発者の作業効率が大幅に向上します。

npm と npx を組み合わせるメリット

効率的なパッケージ管理
npm を使用すれば、プロジェクトの依存関係を簡単に管理でき、再現性のある環境構築が可能です。特に package-lock.json を活用すれば、チーム間で同じ環境を共有できます。
一時的なツールの実行
npx を使用することで、一時的に必要なツールをインストールせずに利用できます。例えば、Nuxt.js や Next.js のプロジェクトを簡単に作成することができます。これにより、環境を汚すことなく新しい技術やツールを試すことが可能です。
開発初期化の迅速化
npx を活用すれば、数行のコマンドでプロジェクトを作成できます。npx create-nuxt-app や npx create-next-app のようなコマンドは、プロジェクトの土台を短時間で準備でき、時間の節約につながります。

成功するプロジェクトに必要なこと

開発を進める上で、以下のポイントを意識すると、プロジェクトが円滑に進行します。

依存関係の明確化
package.json を活用し、必要なライブラリやモジュールを正確に記載します。これにより、他の開発者が同じ環境を構築しやすくなります。
ツールの適切な活用
短期的なツールの利用には npx を、長期的に必要なライブラリのインストールには npm を使用することで、環境管理が簡素化されます。
環境の一貫性
npm install や npm ci を適切に使い分けることで、異なる環境での動作を保証します。また、npm audit で脆弱性を定期的にチェックすることも重要です。
エラー解決の習慣化
エラーが発生した場合は、npm audit や npm dedupe などのコマンドを駆使し、問題を迅速に解決します。