Nuxt Skills

Project layout

Source directory: Prefer srcDir: 'app' so app/ holds pages, components, composables, layouts, middleware. Reference as ~/ (e.g. ~/components/, ~/composables/).
Pages: app/pages/*.vue — file-based routing. Use definePageMeta({ middleware: 'auth' }) for route-level middleware.
Layouts: app/layouts/default.vue (or named). Use <NuxtLayout> or app.vue to wrap content.
Components: app/components/ — auto-imported; use PascalCase names in templates.

Location: app/composables/*.ts — auto-imported. Export functions named useXxx.
Pattern: Accept Ref<T> | T for flexibility; normalize with typeof x === 'string' ? ref(x) : x when needed.
Data fetching: Prefer useAsyncData with a unique key (e.g. time-blocks-${uid}-${day}), async fetcher, and watch for reactive params. Return { data, refresh, pending }.