ViteでVueプロジェクトの開始コマンド

Vite+Vueプロジェクト用テンプレートからプロジェクトを作成

npm create vite@latest vitevue

npm

• Node.jsに付属するパッケージマネージャー（Node Package Manager）の実行
• 「今からnpmの機能を使うよ」宣言

create

• プロジェクト初期化コマンドの実行（npm init というコマンドのエイリアス）
• npm create xx と書くと、npmは自動的に create-xx という名前のプロジェクト作成ツールを検索して実行する

vite@latest

• プロジェクト作成ツールとバージョンの指定
• npm createの仕組みによって、npmはインターネット上から create-vite という「Viteプロジェクト作成専用ツール」の最新版を一時的にダウンロード

vitevue

• 作成するプロジェクトのディレクトリ名

実行結果

# UIライブラリとしてVueを選択
sato@[8:00:11]:~/proj/try% npm create vite@latest vitevue

> npx
> create-vite vitevue

│
◆  Select a framework:
│  ○ Vanilla
│  ● Vue
│  ○ React
│  ○ Preact
│  ○ Lit
│  ○ Svelte
│  ○ Solid
│  ○ Ember
│  ○ Qwik
│  ○ Angular
│  ○ Marko
│  ○ Others
└

# 実行環境や言語の選択でTypeScriptを選択
sato@[8:00:11]:~/proj/try/vitevue% npm create vite@latest vitevue

> npx
> create-vite vitevue

│
◇  Select a framework:
│  Vue
│
◆  Select a variant:
│  ● TypeScript
│  ○ JavaScript
│  ○ Official Vue Starter ↗
│  ○ Nuxt ↗ https://nuxt.com
│  ○ Vike ↗ https://vike.dev
└

# npm installを実行して依存関係のあるライブラリをインストールして実行するかどうか
sato@[8:00:11]:~/proj/try/vitevue% npm create vite@latest vitevue

> npx
> create-vite vitevue

│
◇  Select a framework:
│  Vue
│
◇  Select a variant:
│  TypeScript
│
◆  Install with npm and start now?
│  ● Yes / ○ No
└

# プロジェクトディレクトリを作成し、npm installで依存関係をインストールし、viteを実行
sato@[8:00:11]:~/proj/try/vitevue% npm create vite@latest vitevue

> npx
> create-vite vitevue

│
◇  Select a framework:
│  Vue
│
◇  Select a variant:
│  TypeScript
│
◇  Install with npm and start now?
│  Yes
│
◇  Scaffolding project in /Users/sato/proj/try/vitevue/vitevue...
│
◇  Installing dependencies with npm...

added 48 packages, and audited 49 packages in 8s

9 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities
│
◇  Starting dev server...

> vitevue@0.0.0 dev
> vite


  VITE v8.0.13  ready in 1200 ms

  ➜  Local:   http://localhost:5173/
  ➜  Network: use --host to expose
  ➜  press h + enter to show help
h     

  Shortcuts
  press r + enter to restart the server
  press u + enter to show server url
  press o + enter to open in browser
  press c + enter to clear console
  press q + enter to quit