npm：基礎、React NativeとNode.jsのパッケージマネージャー

npmとは — Node.jsパッケージマネージャー

npmは2010年にIsaac SchlueterによってNode.jsの依存関係管理ソリューションとして作成されました。2014年からnpmはnpm, Inc.によって管理されており、2020年にMicrosoft/GitHubに買収されました。このツールは2つの部分で構成されています：パッケージをインストールおよび管理するためのCLI（コマンドライン）と、registry.npmjs.orgにあるすべての公開モジュールの中央リポジトリであるRegistryです。

npm Registryは最大のパッケージレジストリです：200万以上のパッケージと月間100億以上のダウンロードがあります。各パッケージにはSemVerバージョン、説明、依存関係、ライセンス、作者情報があります。独自のパッケージの公開はnpm publishを介して行います。npmは組織向けのスコープ付きパッケージ（@scope/package）、プライベートレジストリ、組み込みのセキュリティ監査をサポートしています。

Node.jsバージョン18+には、パフォーマンスが向上したnpm 9+、モノレポ用のワークスペース、および再設計されたピア依存関係メカニズムが含まれています。npmエコシステムは、サーバーサイドJavaScript、フロントエンド（React、Vue、Angular）、モバイル開発（React Native）、ビルドツール（Webpack、Vite）、CLIユーティリティをカバーしています。npmはJavaScriptライブラリの主要な配布チャネルです。

npmの主な機能

npm install — package.jsonとpackage-lock.jsonを読み取り、すべての依存関係をnode_modulesにインストールするメインコマンドです。初回実行時に、npmは依存関係グラフを計算し、バージョンの競合を解決し、package-lock.jsonを生成します。npm install <package>コマンドは特定のパッケージをインストールし、--save-devフラグはdevDependenciesに追加し、--globalはグローバルにインストールします。

npx — npmバージョン5.2から含まれているパッケージランナーです。npxを使用すると、グローバルインストールなしでCLIユーティリティを実行できます：npx react-native initやnpx create-react-app my-appなど。npxはパッケージを一時キャッシュにダウンロードし、実行し、完了後にクリーンアップします。npxは特定のバージョンのツールを実行するのにも便利です。

npm auditはnpmデータベースから既知の脆弱性について依存関係ツリーをスキャンします。コマンドは重要度レベル（critical、high、moderate）のレポートを出力し、脆弱なパッケージを自動的に更新するためにnpm audit fixを推奨します。npm cacheはダウンロードしたパッケージをローカルに保存します。npm cache clean --forceはインストールの問題がある場合にキャッシュをクリアします。npm outdatedは古いパッケージを表示します。

# npmの基本コマンド
$ npm install
$ npm install react-native-webview --save
$ npm install typescript --save-dev
# グローバルインストールなしで実行
$ npx react-native init MyApp
# セキュリティ監査
$ npm audit --fix

package.jsonの構造と依存関係管理

package.jsonはプロジェクトルートにあるJSONファイルで、そのメタデータ、依存関係、設定を記述します。必須フィールド：name（一意のパッケージ名）とversion（SemVerバージョン、例：1.0.0）。ファイルはnpm init -yでクイック初期化するか、手動で作成します。

Semantic Versioning（SemVer）はMAJOR.MINOR.PATCH形式のバージョニング標準です。メジャーバージョンは互換性のないAPI変更時に、マイナーは機能追加時（下位互換性あり）、パッチはバグ修正時に変更されます。バージョン前の^記号はマイナーおよびパッチ更新を許可し、~はパッチ更新のみを許可します。

{
  "name": "my-app",
  "version": "1.0.0",
  "private": true,
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios"
  },
  "dependencies": {
    "react": "^18.3.0",
    "react-native": "^0.76.0"
  },
  "devDependencies": {
    "typescript": "^5.5.0",
    "@types/react": "^18.3.0"
  }
}

React Native開発におけるnpm

React Nativeプロジェクトは依存関係管理にnpmを積極的に使用しています。標準セットにはreact、react-native、ナビゲーションライブラリ（React Navigation）、HTTPライブラリ（axios）、状態管理（Redux、Zustand）、UIコンポーネントが含まれます。npmを使用すると、レジストリから数千の互換性のあるパッケージをインストールできます。

npx pod-install — iOS用のReact Nativeでネイティブモジュールをインストールした後の必須コマンドです。npmはpackage-lock.jsonに基づいてPodfile.lockを自動生成します。Expoプロジェクトでは、npm installの代わりにexpo installが使用されます。これは現在のExpo SDKバージョンと互換性のあるバージョンを選択するためです。

バージョンの競合はReact Nativeで一般的な問題です：react-native-reanimated、react-native-gesture-handler、react-native-safe-area-contextは整合性のあるバージョンを必要とします。解決策は、すべてのパッケージを最新の互換バージョンに更新するか、--legacy-peer-depsを使用することです。package-lock.jsonは、CocoaPodsやGradleを介してコンパイルされるネイティブモジュールにとって重要です。

npmと代替マネージャーの比較

npmはNode.jsに同梱されている標準パッケージマネージャーです。主な代替手段：yarn（2016年にFacebookが作成）とpnpm（高速、ハードリンクを使用）。npm 5以降、npmとyarnの速度と機能の差は最小限です。npm 7+はワークスペースを追加し、モノレポで競争力を持つようになりました。

State of JS 2025によると：62%の開発者がnpmを使用し、35%がyarn（主に古いプロジェクトとPnP愛好家）、3%がpnpmを使用しています。React Nativeプロジェクトでは、両方のツールが同等に viable ですが、npmはExpo SDK 50+および新しいReact Native初期化を使用するプロジェクトでより一般的です。

yarnは、より成熟したワークスペース実装とPlug'n'Playにより、非常に大規模なモノレポ（100+パッケージ）で優位性を維持しています。pnpmはグローバルストアへのハードリンクによるディスク容量の節約で勝っています。マネージャーの選択はチームの好みとインフラストラクチャに依存します。