npm run serveとnpm run devの違い

npm run serve？ npm run dev?

VueでWebアプリケーションを開発していた際にフロントエンドのデバッグとしてnpm run serveとnpm run devがあることを知った．
両者の違いを備忘録として残す．

先に結論

npm run serveを使う時

Vue CLIでプロジェクトを作った場合

npm run devを使う時

viteでプロジェクトを作った場合

Vue CLI と viteって何

Vue CLIとviteはどちらもVueアプリケーションのビルドツール

Vue CLI

Vueでプロジェクトを作る際に

vue create プロジェクト名

のコマンドを使う場合はVue CLIによって構成される

注意
Vue CLIでプロジェクトをビルドしたい場合は以下のコマンドでVue CLIをインストールしておく

npm install -g @vue/cli

vite

Vueでプロジェクトを作る際に

npm create vue@latest

のコマンドを使う場合はviteで構成される．

ちなみに

ターミナルもしくはコマンドラインで

npm run

を実行すると，ビルドツールの使い方がわかる．

Vue CLIでの例

結論

なんでnpm run serveでデバッグできないの!!となったら，
一旦npm runを走らせて自分のビルドツールを確認しましょう．
どうやらviteを使った方が高速化されるらしいので，主流はviteなんですかね?