テンプレート一覧に戻る

Nuxt 3 + Vue 3 + TypeScript

Nuxt 3 + Vue 3 Composition API + TypeScript のフルスタック向けCLAUDE.md。SSR/SSG対応のモダンなVue開発に最適です。

中級nuxtvuetypescript
CLAUDE.md
# プロジェクト名

Nuxt 3 + Vue 3 + TypeScript で構築されたWebアプリケーション。

## 技術スタック

- **フレームワーク**: Nuxt 3.15+
- **言語**: TypeScript 5.x + Vue 3 Composition API
- **スタイリング**: UnoCSS / Tailwind CSS v4
- **状態管理**: Pinia
- **テスト**: Vitest + @vue/test-utils
- **パッケージマネージャ**: pnpm

## コマンド

| コマンド | 用途 |
|---------|------|
| `pnpm dev` | 開発サーバー起動 (localhost:3000) |
| `pnpm build` | プロダクションビルド |
| `pnpm generate` | 静的サイト生成 |
| `pnpm lint` | ESLint実行 |
| `pnpm test` | Vitest実行 |

## ディレクトリ構造

| パス | 役割 |
|-----|------|
| `pages/` | ファイルベースルーティング |
| `components/` | Vue コンポーネント(自動インポート) |
| `composables/` | Composition API ユーティリティ |
| `server/` | Nitro サーバールート・API |
| `stores/` | Pinia ストア |
| `layouts/` | レイアウトコンポーネント |

## コーディング規約

- Composition API(`<script setup>`)を使用
- コンポーネント名はPascalCase、ファイル名もPascalCase
- composableは `use` プレフィックス必須
- 自動インポートを活用し、明示的importは最小限に
- サーバーAPIは `server/api/` に配置
- Piniaストアは Setup Store 形式を推奨

## Git規約

- ブランチ: `feature/`, `fix/`, `chore/`
- コミットメッセージ: Conventional Commits形式

関連ガイド

検索

ガイドやテンプレートを検索...