npm run dev と npm run start:dev の違い|Node.js開発コマンド使い分けガイド

Node.jsプロジェクトで開発サーバーを起動しようとして、こんな経験ありませんか?「npm run dev」って書いてあるREADMEと「npm run start:dev」を使っているチームメンバー。package.jsonを見ると両方のコマンドが定義されていて、「結局どっちを使えばいいの?」と混乱してしまう。

実は、この2つのコマンドには技術的な違いはほとんどありません。どちらもpackage.jsonで定義された「ただのエイリアス(別名)」なのですが、プロジェクトやフレームワークによって慣習的な使い分けがあるのが実情です。この記事では、迷わずに正しいコマンドを選べるようになる判断基準をお伝えします。

目次

なぜdevコマンドが2種類あるのか?よくある混乱

Node.js開発を始めたばかりの方や、新しいプロジェクトに参加したとき、最初に戸惑うのがこの問題です。

典型的な混乱シーン

  • READMEには「npm run dev」と書いてあるのに、先輩は「npm run start:dev」を実行している
  • package.jsonを開いたら両方のスクリプトが定義されていて、違いが分からない
  • 別のプロジェクトに移ったら使うコマンドが変わっていた
  • 「どっちでも動くけど、正式にはどっち?」とチームで議論になる

この混乱の原因は、フレームワークやツールごとに異なる慣習があり、さらに各プロジェクトでカスタマイズされているからです。

npm run dev と npm run start:dev の本質的な違い

結論から言うと、「npm run dev」と「npm run start:dev」自体に技術的な違いはありません。どちらもpackage.jsonの「scripts」セクションで定義された、ただのコマンドのエイリアス(別名)です。

package.jsonで確認する方法

プロジェクトのルートディレクトリにあるpackage.jsonを開いて、"scripts"セクションを見てみましょう。

{
  "name": "my-project",
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start"
  }
}

このNext.jsプロジェクトの例では、npm run devを実行すると、実際にはnext devというコマンドが実行されます。つまり、「dev」は「next dev」の省略形として定義されているだけです。

名前が違うだけで、中身は同じこともある

プロジェクトによっては、両方のスクリプトが定義されていて、実行内容が全く同じという場合もあります。

{
  "scripts": {
    "dev": "vite",
    "start:dev": "vite"
  }
}

この場合、どちらを実行しても全く同じ結果になります。チーム内で統一すれば良いだけの話です。

フレームワーク・ツール別の慣習

混乱の主な原因は、フレームワークやツールごとに推奨されるコマンド名が違うことです。ここでは主要なフレームワークでの慣習を整理します。

Next.js:npm run dev が標準

Next.jsプロジェクトでは、公式ドキュメントでも「npm run dev」が推奨されています。

{
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  }
}

Next.jsプロジェクトに参加したら、基本的には「npm run dev」を使うと覚えておきましょう。

NestJS:npm run start:dev が標準

NestJS(バックエンドフレームワーク)では、逆に「npm run start:dev」が公式の慣習です。

{
  "scripts": {
    "start": "nest start",
    "start:dev": "nest start --watch",
    "start:debug": "nest start --debug --watch",
    "start:prod": "node dist/main"
  }
}

NestJSでは、startコマンドのバリエーションとして、start:dev(開発モード)、start:debug(デバッグモード)、start:prod(本番モード)というコロン区切りの命名規則を採用しています。

Vite/React:npm run dev が主流

Viteを使ったReactプロジェクトでは、Next.jsと同様に「npm run dev」が標準です。

{
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview"
  }
}

Express/Node.js:プロジェクトによってバラバラ

純粋なNode.jsやExpressプロジェクトでは、統一された慣習がありません。プロジェクトごとに自由に定義されていることが多いです。

{
  "scripts": {
    "dev": "nodemon src/index.js",
    "start": "node src/index.js"
  }
}

または、

{
  "scripts": {
    "start:dev": "tsx watch src/index.ts",
    "start:prod": "node dist/index.js"
  }
}

このようにプロジェクトによってバラバラなので、必ずpackage.jsonを確認する習慣をつけましょう。

プロジェクト別:どちらを使うべきか

実際のプロジェクトでどちらを使うべきか、判断基準を整理します。

判断基準1:フレームワークの公式慣習に従う

Next.js、Vite → 「npm run dev」
NestJS → 「npm run start:dev」

公式のスターターテンプレートやドキュメントで推奨されているコマンドを使うのが、最も混乱が少ない選択です。

判断基準2:プロジェクトのREADMEを確認

既存のプロジェクトに参加する場合、READMEに明記されているコマンドを使いましょう。チーム内で統一されているはずです。

判断基準3:package.jsonで実際の内容を確認

どうしても分からない場合や、READMEが古い可能性がある場合は、package.jsonのscriptsセクションを直接確認して、実行内容を理解するのが確実です。

迷ったときの確認手順(3ステップ)

「どっちのコマンドを使えばいいか分からない」と迷ったときは、以下の手順で確認しましょう。

Step 1: package.jsonを開く

プロジェクトのルートディレクトリにあるpackage.jsonをエディタで開きます。

# VS Codeの場合
code package.json

# Vimの場合
vim package.json

Step 2: scriptsセクションを確認

"scripts"セクションを見つけて、定義されているコマンドをすべて確認します。

{
  "scripts": {
    "dev": "next dev",
    "start:dev": "next dev",
    "build": "next build"
  }
}

この例では、devstart:dev全く同じコマンドを実行することが分かります。

Step 3: 実行内容を理解する

各スクリプトが何を実行するのか理解すれば、どれを使っても問題ないか、使い分けが必要かが判断できます。

✅ 同じ内容なら、どちらでもOK
⚠️ 内容が違う場合は、目的に応じて使い分ける

チーム開発での統一ルール作り

個人開発なら好きなコマンド名で良いですが、チーム開発では統一ルールが重要です。

READMEに明記する

プロジェクトのREADME.mdに、開発サーバーの起動コマンドを明記しましょう。

## 開発環境のセットアップ

### 開発サーバーの起動
```bash
npm run dev
```

開発サーバーは http://localhost:3000 で起動します。

新メンバー向けオンボーディング

新しいメンバーがプロジェクトに参加したときに、最初に教えるべき基本コマンドの一つです。

  • 開発サーバー起動:npm run dev
  • ビルド:npm run build
  • テスト実行:npm test
  • リンター実行:npm run lint

スクリプト命名のベストプラクティス

新規プロジェクトを立ち上げる際は、以下のベストプラクティスを参考にしてください。

シンプルで分かりやすい名前を使う

  • 開発モード:dev
  • 本番ビルド:build
  • 本番起動:start
  • テスト:test

環境ごとにコロン区切りで整理(NestJS方式)

  • start:dev – 開発環境で起動
  • start:prod – 本番環境で起動
  • start:debug – デバッグモードで起動

どちらの方式でも良いですが、プロジェクト内で統一することが大切です。

よくあるトラブルと解決法

トラブル1: “script not found” エラーが出る

症状:

$ npm run start:dev
npm ERR! missing script: start:dev

原因:package.jsonにstart:devスクリプトが定義されていない。

解決法:

  • package.jsonのscriptsセクションを確認
  • 定義されているコマンド名を使う(おそらくnpm run dev
  • または、必要なスクリプトを追加する

トラブル2: 期待と違う動作をする

症状:npm run devを実行したのに、ホットリロードが効かない、またはデバッグモードにならない。

原因:スクリプトの定義が期待と違う内容になっている。

解決法:

// 間違った定義例
{
  "scripts": {
    "dev": "node src/index.js"  // watchモードじゃない!
  }
}

// 正しい定義例
{
  "scripts": {
    "dev": "nodemon src/index.js"  // watchモード
  }
}

package.jsonのスクリプト定義を修正する必要があります。

トラブル3: ポート競合の問題

症状:

Error: listen EADDRINUSE: address already in use :::3000

原因:すでに別のプロセスがポート3000を使用している。

解決法:

# macOS/Linuxの場合
lsof -ti:3000 | xargs kill -9

# Windowsの場合
netstat -ano | findstr :3000
taskkill /PID [プロセスID] /F

または、異なるポートで起動する設定に変更します。

まとめ:迷わないための判断基準

「npm run dev」と「npm run start:dev」の使い分けで迷わないための、最終的な判断基準をまとめます。

✅ フレームワークの慣習を優先

  • Next.js、Vite → npm run dev
  • NestJS → npm run start:dev

✅ プロジェクトのREADMEを確認

  • チーム内で統一されたコマンドが記載されているはず
  • 記載がなければpackage.jsonを直接確認

✅ package.jsonで実行内容を理解

  • 同じ内容ならどちらでもOK
  • 違う内容なら目的に応じて使い分け

✅ 新規プロジェクトでは統一ルールを作る

  • READMEに明記
  • チーム内で共有
  • 新メンバーへのオンボーディングに含める

この判断基準を使えば、どんなプロジェクトでも迷わずに正しい開発コマンドを選択できるようになります。プロジェクトに参加したら、まずはpackage.jsonを確認する習慣をつけましょう!

npm開発をさらに効率化する関連記事

npmコマンドの使い分けを理解したら、AI開発ツールやコーディング支援ツールも活用して、より効率的な開発環境を構築しましょう:

AI開発・コーディング支援

開発効率化・生産性向上

npm run dev と npm run start:dev よくある質問

❓ npm run dev と npm run start:dev は技術的に違うコマンドですか?

いいえ、技術的な違いはありません。どちらもpackage.jsonの「scripts」セクションで定義された、ただのエイリアス(別名)です。実行される内容はpackage.jsonの定義次第で、同じ場合もあれば異なる場合もあります。フレームワークやプロジェクトの慣習によって使い分けられているだけです。

❓ Next.jsではどちらのコマンドを使うべきですか?

Next.jsでは「npm run dev」が公式で推奨されています。Next.jsの公式ドキュメントやスターターテンプレートでも「dev」スクリプトが標準設定されているため、特別な理由がない限り「npm run dev」を使用するのがベストプラクティスです。

❓ どちらのコマンドを使えばいいか分からないときの確認方法は?

プロジェクトルートの「package.json」を開いて、「scripts」セクションを確認してください。そこに定義されているコマンド名と実行内容を見れば、どちらを使うべきか、または両方が同じ内容かが分かります。プロジェクトのREADME.mdにも通常は開発コマンドが記載されています。

❓ NestJSで「npm run dev」を実行するとエラーが出るのはなぜ?

NestJSでは「npm run start:dev」が標準の開発コマンドで、「dev」スクリプトが定義されていない可能性が高いです。NestJSはコロン区切りの命名規則(start:dev、start:prod、start:debug)を採用しているため、「npm run start:dev」を使用してください。package.jsonで実際の定義を確認するのが確実です。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次