nuxt-content

Build typed, content-driven Nuxt applications with @nuxt/content collections and queries.

Updated Aug 8, 2026
One-click install
npx skills add https://github.com/wolfstar-project/code-zero --skill nuxt-content-wolfstar-project
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: nuxt-content
Source: https://github.com/wolfstar-project/code-zero/tree/main/.agents/skills/nuxt-content
Command: npx skills add https://github.com/wolfstar-project/code-zero --skill nuxt-content-wolfstar-project

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @nuxt/content, zod, and includes references (resource) components.

What problem does it solve? It guides developers through building content-driven Nuxt applications with @nuxt/content, covering typed collections, querying, rendering, and deployment so content schemas, queries, and routes stay consistent. ## Core Features & Use Cases - Typed Collections: Define page and data collections in content.config.ts with Zod or Valibot schemas, indexes, and local or remote sources. - Querying and Rendering: Use queryCollection, navigation, surroundings, and search helpers, then render Markdown and MDC through ContentRenderer and prose components. - Configuration and Migration: Configure database adapters (SQLite, D1, PostgreSQL, libSQL), hooks, transformers, custom sources, and migrate from Content v2. - Use Case: You are building a documentation site in Nuxt and need localized collections, full-text search sections, and a catch-all page that renders Markdown with syntax highlighting. ## Quick Start Ask the AI to set up a Nuxt Content docs collection with a typed schema and a catch-all page that queries and renders Markdown content.

Frequently Asked Questions about nuxt-content

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I query content collections in Nuxt Content v3?▼

Use queryCollection with the collection name, then chain where, order, select, limit, and all or first. Wrap initial render queries in useAsyncData so Nuxt transfers the result in its payload, and pass the event as first argument in Nitro server handlers.

How do I define typed collections in content.config.ts?▼

Use defineContentConfig with defineCollection, choosing type page for route-mapped files or data for structured records. Attach a Zod or Valibot schema, source globs, and optional indexes; run npx nuxi typecheck to verify generated types.

Does Nuxt Content support remote or API content sources?▼

Yes, collections can pull from remote Git repositories with authentication or from APIs via defineCollectionSource with getKeys and getItem. Keys must stay stable across builds, and credentials belong in environment variables.

How do I migrate from Nuxt Content v2 to v3?▼

Replace queryContent with collection-scoped queryCollection and use the queryCollection equivalents for navigation, surroundings, and search. Add an explicit catch-all page, render through ContentRenderer, and use .navigation.yml with the v3 built-in fields.

Why is my Nuxt Content query returning empty results?▼

Empty queries usually mean the collection source glob does not include the file, such as .navigation.yml being excluded by a Markdown-only pattern. Confirm the source include and exclude patterns, then run npx nuxi cleanup and restart if generated content is stale.

Which databases does Nuxt Content support for deployment?▼

Nuxt Content supports SQLite (default), Cloudflare D1, PostgreSQL, libSQL, and PGlite adapters configured under content.database. Static builds package content into the app, while server targets restore the generated dump on first query.