Nuxt + Sanity Integration Best Practices

Best-practices guide for the @nuxtjs/sanity module (Nuxt 3). Covers module setup, composables, SSR data fetching, image handling, Portable Text, visual editing, TypeScript, and Nitro server routes.

Also load the nuxt skill for Nuxt core patterns and sanity-best-practices for GROQ query optimization and schema design. This skill covers the integration layer only.

ROUTING: Which rule file to load

IF setting up the module or configuring nuxt.config.ts: → Read rules/core-module-setup.md

IF using useSanityQuery, useLazySanityQuery, or useSanity composables: → Read rules/core-composables.md

IF writing Nitro server routes that query Sanity: → Read rules/core-server-routes.md

IF working with the SanityImage component or useSanityImage(): → Read rules/features-sanity-image.md

IF rendering Portable Text with SanityContent: → Read rules/features-sanity-content.md

IF implementing visual editing, live preview, stega, or the Presentation tool: → Read rules/features-visual-editing.md

IF experiencing stale data, cache misses, or reactive query bugs: → Read rules/perf-query-keys-and-caching.md

IF debugging CORS errors, auth token issues, or hydration mismatches: → Read rules/debug-common-errors.md

IF generating a dynamic sitemap from Sanity routes (works, case studies, etc.): → Read rules/features-sitemap.md

Rule index

Rule categories by priority

Coverage and maintenance

• Coverage map: rules/_coverage-map.md
• Module source: https://github.com/nuxt-modules/sanity
• Update when @nuxtjs/sanity releases a new major version or visual editing APIs change.