pkkiblog 暇なときに投稿しています
サーバー パソコン デザイン・グラフィック レビュー

【Node.js入門②】npmとpackage.jsonの仕組みを理解しよう!!(初心者向け)

schedule 2025年10月27日  update 2025年10月27日        
【Node.js入門②】npmとpackage.jsonの仕組みを理解しよう!!(初心者向け)
サムネイル

どうも皆さんこんにちは!pkkiです

今回は、「Node.js入門その2」ということで、npmとpackage.jsonの仕組みを初心者向けに丁寧に画像付きで解説したいと思います。

また、前回は「【Node.js入門】最短5分!初心者向けインストール&Hello World」という記事も書いたので、是非そちらもご覧ください。

そして、今回のこの範囲は基礎中の基礎で重要です。
なので、次回のExpress導入に向けて、最後までしっかりと読みましょう!

npmって聞いたことあるけど難しそうですね…

それが、案外使ってみると「こんなん余裕やん」と思います!
ですので、是非この記事を読んで実際に使っていきましょう!

npmとは?

初めに、npmについて解説していきます。

npmとは、「Node Package Manager」の略で、Node.jsの標準パッケージの管理するツールです。

よって、webアプリ開発等において便利なパッケージをそのプロジェクトにインストールして使用することができます。

パッケージとは?

Node.jsの「パッケージ」とは、特定の機能を実現するために作られたJavaScriptの部品のまとまりのことです。
たとえば「日付を扱う」「ファイルを読み書きする」「Webサーバーを動かす」などの便利な機能を、他の人が作ったパッケージとして公開された物を使うことができます。

つまり、パッケージ=すぐ使える便利な機能のセットです。

npmでできること

このように、npmはただ、「パッケージを管理するシステム」なのです。

なるほど!1から作ったら複雑になるコードなどを、npmで他の人が作ったパッケージをインストールすることによって、簡単に作れるのですね!

はい、そういう理解で大丈夫です!!

頻繁に使うコマンド一覧

初期設定

npm init

このコマンドで初期設定をしてpackage.jsonが生成されます。

また、今回はこのpackage.jsonについて詳しく解説します。

パッケージのインストール

#すべてpackage.jsonのdependenciesに書き込まれる
 
npm install パッケージ名[@バージョン]
npm i パッケージ名[@バージョン]
npm add パッケージ名[@バージョン]
#例:
npm install express

そして、パッケージインストールのコマンドは同じ意味のコマンドが3つあります。また、以下はオプションです。

#グローバルにインストールする場合

npm install -g パッケージ名[@バージョン]
#package.jsonのdependenciesに書き込みをする場合(npm v5以降はデフォルトにより不要)

npm install パッケージ名 --save
#package.jsonのoptionalDependenciesとして記録されます。
#また、プロジェクトに必須ではないが、オプションとして、依存関係にあることを示すために使用される。

npm install パッケージ --save-optional
#package.jsonのdevDependenciesとして記録されます。
#どうやら、git cloneをしてnpm install --productionとしたときに、devDependenciesはインストールされないようです。あまり使いません

npm install パッケージ名 --save-dev

このように、色々なインストールコマンドがあります。

しかし、基本的に「npm i パッケージ名[@バージョン]」でOKです。

インストール済みパッケージ情報の表示

#※[-g]はグローバル
npm list [-g]
npm ls [-g]
npm la [-g]
npm ll [-g]

また、インストール済みパッケージ情報の表示もこのように複数の同じコマンドが存在します。

パッケージのアップデート

#※[-g]はグローバル
npm update [パッケージ名] [-g]

そして、パッケージのアップデートは上のコマンドで可能です。

また、npm updateだけは「package.json」に記述されたパッケージすべてがアップデートされます。

パッケージのアンインストール

#※[-g]はグローバル
npm uninstall パッケージ名 [-g]
npm un パッケージ名 [-g]
npm unlink パッケージ名 [-g]
npm rm パッケージ名 [-g]
npm r パッケージ名 [-g]

続いて、アンインストールはこのようにまた複数の同じコマンドが存在します。

npm uninstall --save
npm uninstall --save-optional
npm uninstall --save-dev

そして、package.jsonに反映させるためには上のコマンドを実行します。

基本的にこれらのコマンドを覚えておけば、「npm」のコマンドはほぼ問題ないでしょう。

ここで、npmのコマンドについて紹介してくれるのは検索の手間が省けますね!
有難いです!

ということで、次にpackage.jsonについて解説します!

package.jsonとは?

package.json

package.jsonは「npmを使っていると自然に生成される設定ファイル」のことです。

また、その内容は「プロジェクトの基本情報」や「依存パッケージ(dependencies)」などです。

{
  "name": "blog-example",
  "version": "1.0.0",
  "description": "blog-example",
  "license": "ISC",
  "author": "pkki",
  "type": "commonjs",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "dependencies": {
    "express": "^5.1.0"
  }
}

次に、実際の例を見ながら1行ずつ説明していきます。

名前説明
nameプロジェクト名
versionプロジェクトのバージョン
descriptionプロジェクトの説明
licenseプロジェクトのMITやISC等のソースコードの利用・変更・再配布に関するルールを定めたもの
authorプロジェクトの著者
typeJSランタイム(CommonJSやES modules等)
mainメインのjsファイル
scriptsショートカット
dependencies依存パッケージ

ざっくりと説明すると、このような感じとなっています。

また、説明不足なところだけ今から解説していきます。

type

typeは、何の「JSランタイム」を使うかの設定です。

「JSランタイム」とは
JavaScriptを実行するために必要なソフトウェアやライブラリのことです。Node.jsでは主に「CommonJS」が使われています。

そして、「CommonJS」のほかにも「ES Modules」というものがあり、これはNode.jsだけでなくウェブブラウザもサポートしており、並列処理可能でトップレベルのawaitを使用することができます。

そして、色々私が調べた感じでは、これからは利点が大きい「ES Modules」が主流となっていくそうです。

scripts

npm run ショートカット名

scriptsは、ショートカットを設定できる設定です。そして、そのショートカットは上のコードで実行できます。

例えば、ショートカットでnpm run server & npm run watchを設定したいとします。

"scripts": {
    "foo": "npm run server & npm run watch"
  },
// npm run foo で npm run server & npm run watchが実行できる!
// TIP:
// & :並列処理
// &&:前のコマンドが成功したら次を実行
// ||:前のコマンドが失敗したら次を実行

このように、設定することができます。

なるほど!これを使いこなせば、いちいち長い文字を打たなくてもいいですね!

そうなんですよ!地味に便利なので覚えておきましょう!

では、早速package.jsonを作ってみましょう!

package.jsonを作ってみよう!

package.jsonをVSCodeで作成
npm init

初めに、VSCode等でターミナルを開いて上のコマンドを実行してください。

VSCodeで実行ポリシーエラーが起きた場合
これはただのPowerShell実行ポリシーエラーなので、「PowerShell」を管理者権限で開いて、
「 Set-ExecutionPolicy RemoteSigned」を実行し、実行ポリシーを変更してください。
package.json作成中

npm initを実行すると、次のような10個の質問が表示されます。
それぞれの意味と入力例を見ていきましょう。

質問

package name
 → プロジェクト名を入力します。
  例:my-node-app

version
 → プロジェクトのバージョンです。基本は 1.0.0 のままでOK。

entry point
 → メインのJavaScriptファイル名を指定します。
  例:index.js(そのままで問題ありません)

test command
 → npm run test で実行するテストコマンドを指定します。
  使わない場合は空のままでOK。

git repository
 → GitHubなどにリポジトリがある場合、そのURLを入力します。
  使わないなら空のままでOK。

keywords
 → 検索用のキーワードを入力します。空でもOK。

author
 → 作者名を入力します(自分の名前やニックネーム)。

license
 → ライセンスを指定します。特に指定がなければ ISC のままでOK。

type
 → モジュールの種類です。基本は commonjs のままでOK。

Is this OK? (yes)
 → 最後に内容の確認が表示されるので、問題なければそのまま Enter。

よって、これで package.json の初期設定が完了です!

詳細は「package.jsonとは?」で説明してます!

また、npm init -yで実行すると質問なしで自動生成されます。

まとめ

今回は、Node.js入門その2として npmとpackage.jsonの仕組み を解説しました。
ポイントを振り返ると次の通りです。

  1. npmとは?
    Node.js用のパッケージ管理ツールで、便利な機能を簡単にプロジェクトに追加できる。
  2. パッケージの使い方
    • インストール:npm i パッケージ名[@バージョン]
    • アップデート:npm update
    • アンインストール:npm uninstall パッケージ名
      基本はこれだけ覚えておけばOK。
  3. package.jsonとは?
    プロジェクトの情報や依存パッケージを管理する設定ファイルで、npmを使うと自動で生成される。
  4. 重要な項目の意味
    • name:プロジェクト名
    • version:バージョン
    • main:メインのJSファイル
    • dependencies:依存パッケージ
    • scripts:よく使うコマンドのショートカット
    • type:JSランタイムの種類(CommonJS / ES Modules)
  5. 実際に作ってみる
    npm init を使えば、10個の質問に答えるだけで簡単にpackage.jsonを作成可能。
    npm init -y なら質問なしで自動生成もできる。

💡 ポイント
npmとpackage.jsonを理解すると、他の人が作った便利な機能を簡単に取り入れられ、Webアプリ開発がぐっとスムーズになります。
今回学んだ基礎知識は、次回の Expressを使ったサーバー開発 で必要ですので、覚えておきましょう!


ぜひ、この記事を参考に 実際に手を動かしてnpmとpackage.jsonを使ってみてください!
次回は、いよいよ Expressで簡単なサーバーを立ち上げます!

最後までご覧いただきありがとうございました!
質問やご指摘等があれば、コメント欄に書いてくれると幸いです!

この記事は役に立ちましたか?

この記事を書いた人

コメントはこちらからどうぞ

コメントはこちらで承認の作業を行うまでは表示されません。ご了承ください。