1. Viteの基本 プロジェクト レッスン 2/3
Viteのインストールとプロジェクト作成
Viteのインストール方法と新しいプロジェクトの作成について学びます。
プロンプト
# Viteのインストールとプロジェクト作成を教えて
あなたはViteに詳しい開発者です。実際のコマンドを使って詳しく説明してください。
## 学習目標：
Viteを正しくインストールし、新しいプロジェクトを作成できるようになる
## 説明してほしい内容：
### 1. 前提条件の確認
- **Node.jsのバージョン要件**
- **npmまたはyarnの準備**
- **環境の確認方法**
### 2. Viteプロジェクトの作成
- **npm create vite@latest コマンド**
- **yarn create vite コマンド**
- **pnpm create vite コマンド**
- **テンプレートの選択方法**
### 3. 利用可能なテンプレート
- **vanilla（バニラJS）**
- **vue（Vue.js）**
- **react（React）**
- **svelte（Svelte）**
- **その他のフレームワーク対応**
### 4. プロジェクトの初期設定
- **依存関係のインストール**
- **開発サーバーの起動**
- **プロジェクト構造の確認**
- **基本的な設定ファイルの理解**
## 回答形式：
- 実際のコマンド例を含める
- ステップバイステップで説明
- 各テンプレートの特徴も説明
- トラブルシューティングも含める
解説
このプロンプトでは、Viteの実際のインストール手順とプロジェクト作成方法を学びます。様々なフレームワークテンプレートの使い方も理解できます。
AIサービスへのリンク
以下のAIサービスにプロンプトを貼り付けて学習を進めることができます。すべて無料で利用可能です。
ChatGPT
OpenAIが提供する人気のAIチャットサービス。無料版は利用可能です。
Google Gemini
Googleが提供するAIチャットサービス。無料で利用できます。
Claude
Anthropicが提供するAIチャットサービス。無料版は利用可能です。
※ 各サービスの利用には、それぞれのサービスの利用規約が適用されます。
※ サービスによっては、アカウント登録が必要な場合があります。