はじめに
先日、Node.js の開発環境を整理していた際に、「NVM」「Volta」「npm」「Vite」「TypeScript（ts / tsc / nts）」といったツールがごちゃ混ぜになり、どれが何をしているのか混乱してしまいました。
特に、ハンズオン資料では「nvm install」を指示されているのに、自分の環境では Volta を使っているため、「読み替えて進めてよいのか？」「何が違うのか？」と疑問が生じました。
同じように混乱している方も多いと思うので、今回は Node.js の周辺ツールの役割と関係性 を整理してまとめました。
概要
今回の記事では、以下の内容を整理します。
- Node.js と npm の関係
- NVM と Volta の違い（バージョン管理ツール）
- Vite が担う役割
- TypeScript（ts / tsc / nts）の位置づけ
- 各ツールをどのように組み合わせて使えばよいか
- 実際にハンズオンなどで「nvm」と書かれていた場合の読み替え方
特に、Windows と macOS での環境構築の違い や、Volta ユーザーが NVM 指定の資料を読む際の注意点を中心に整理しています。
Node.js と npm
Node.js とは？
- JavaScript をサーバーサイドで実行できるようにしたランタイム環境。
- ブラウザ外でも JavaScript を動かせるようにしたもの。
npm とは？
- Node.js に付属する パッケージ管理ツール。
- ライブラリの追加・削除・更新などを行うためのツール。
-
npm installなどで依存関係を自動で管理。
🧩 まとめ
Node.js = エンジン（実行環境）
npm = Node.js 向けのライブラリ管理人（依存解決係）
NVM と Volta（Node.js バージョン管理ツール）
Node.js のバージョンを切り替えたいときに使うのが「NVM」や「Volta」。
| 比較項目 | NVM | Volta |
|---|---|---|
| 主な役割 | Node.js のバージョン管理 | Node.js + npm + CLIツールの管理 |
| 切り替え単位 | 手動で切り替え (nvm use) |
自動で切り替え（プロジェクトごと） |
| 対応OS | macOS / Linux（nvm-windowsも別途あり） | Windows / macOS / Linux 全対応 |
| 管理対象 | Node.js | Node.js / npm / yarn / pnpm / Vite など |
| バージョン指定方法 |
.nvmrc ファイル |
package.json 内の "volta" 設定 |
| 特徴 | 軽量で歴史が長い | 開発チーム共有に強い（自動切替） |
🧠 ポイント
-
NVM は「手動切り替え型」
nvm install 24.3.0 nvm use 24.3.0
Volta は「自動管理型」
Volta はプロジェクト単位で Node.js のバージョンを自動切り替えできるツールです。
よく使うコマンド
# Node.js のインストール（グローバルデフォルトに設定される）
volta install node@24.3.0
# プロジェクト内でバージョン固定
volta pin node@24.3.0
Volta の強み
📌 Volta の最大の利点
プロジェクトを開くだけで、正しい Node.js バージョンが自動的に選択されます。
そのため、チーム開発・講座運営・ハンズオン などで特に力を発揮します。
Vite とは？
モダンフロントエンド開発のための ビルドツール兼開発サーバー です。
- Webpack より圧倒的に高速
- 開発中のホットリロードが速い
- Node.js 上で動作するため、Node のバージョン依存が強い
よく使うコマンド
# プロジェクト作成
npm create vite@latest
# 開発サーバー起動
npm run dev
補足：Vite を使うための前提
Vite は npm 経由で利用されるため、
Node.js と npm のバージョンが正しく整っていることが前提となります。
TypeScript（ts / tsc / nts）
| 用語 | 意味 |
|---|---|
| TypeScript(ts) | JavaScript に型を導入した言語 |
| tsc | TypeScript コンパイラ（ts → js に変換） |
| nts | TypeScript を Node.js で直接実行できる CLI（Node + TS） |
使用例
# tsc でコンパイルする場合
npx tsc index.ts
# nts で直接 TypeScript を実行する場合
npx nts index.ts
🧩 まとめ（TypeScript 実行方法）
- tsc：TypeScript を JavaScript にコンパイルしてから実行
- nts：TypeScript を直接実行できる（学習用途にも便利）
Volta 環境で「nvm」指示の資料を読み替える方法
ハンズオン資料やチュートリアルでは「nvm install」が頻出しますが、
Volta を使っている場合は以下のように読み替えれば OK です。
| 資料の記載 | Volta での対応コマンド |
|---|---|
nvm install 24.3.0 |
volta install node@24.3.0 |
nvm use 24.3.0 |
※不要（Volta は自動適用） |
.nvmrc |
package.json の "volta" に記載 |
node -v |
同じ（バージョン確認） |
トラブル時のチェックポイント
| 症状 | 対応方法 |
|---|---|
nvm が認識されない |
Volta環境では正常。volta install を使用 |
node -v が古い |
volta install node@最新版 |
npm が動かない |
volta install npm@latest |
| PATH が競合している | Volta と NVM を併用しない（どちらかに統一） |
macOS と Windows の使い分け
| OS | 推奨管理ツール |
|---|---|
| macOS / Linux | NVM（brewで導入が簡単） |
| Windows | Volta（PATH競合が少なく自動管理） |
どちらを使う場合でも、
「Node.js と npm を誰が管理しているか」 を意識すると理解が早くなります。
環境まとめ一覧
- Node.js：JavaScript の実行環境
- npm：Node.js のパッケージ管理ツール
- NVM / Volta：Node.js のバージョン管理ツール
- Vite：フロントエンド開発用の高速ビルドツール
- TypeScript / tsc / nts：型付き JavaScript とその実行ツール
💡 Volta を使用している場合、nvm のコマンドは Volta 用に読み替えてOK！
考察
Node.js 周辺のツールは名前が似ており、初学者ほど混乱しがちです。
しかし、各ツールの役割をしっかり整理して理解しておくことで、
環境構築・エラー対応・バージョン管理が一気にスムーズになります。
特に、
- 環境管理（NVM / Volta）
- 実行・開発（npm / Vite / ts / nts）
という役割分担を把握しておくと、
バージョン衝突や PATH 関連の問題を素早く発見できます。
自分自身の備忘録としても、また同じ疑問を持つ方の助けになれば幸いです。
最後まで読んでいただき、ありがとうございました！