はじめに

先日、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 関連の問題を素早く発見できます。

自分自身の備忘録としても、また同じ疑問を持つ方の助けになれば幸いです。

最後まで読んでいただき、ありがとうございました！