nuxt-seo-best-practices
starsforks
How to install nuxt-seo-best-practices?
vinayakkulkarni/vue-nuxt-best-practices/nuxt-seo-best-practices
$npx -y skills add vinayakkulkarni/vue-nuxt-best-practices --skill nuxt-seo-best-practicesNuxt SEO optimization guidelines for Cloudflare-deployed applications. Covers dynamic OG image generation on CF Workers, page SEO composables, JSON-LD structured data, SSR externals, and Nitro configuration. Triggers on tasks involving SEO, meta tags, OG images, Open Graph, Sator
SKILL.md
| 1 | # Nuxt SEO Best Practices |
| 2 | |
| 3 | Comprehensive SEO optimization guide for Nuxt 4 applications deployed to Cloudflare Pages/Workers. Contains 11 rules across 4 categories, prioritized by impact to guide automated refactoring and code generation. |
| 4 | |
| 5 | > **Nuxt 4.5 note:** head management now runs on `unhead` v3 — `useHead` typing is stricter (type errors after upgrading are usually genuine tightening, not regressions) and promise input is no longer supported. All `useHead`/`useSeoMeta` examples in this skill use plain synchronous values and are v3-compatible. |
| 6 | |
| 7 | ## When to Apply |
| 8 | |
| 9 | Reference these guidelines when: |
| 10 | |
| 11 | - Generating dynamic OG images on Cloudflare Workers |
| 12 | - Setting up page-level SEO meta tags and composables |
| 13 | - Adding JSON-LD structured data |
| 14 | - Configuring Nitro for Cloudflare Pages deployment |
| 15 | - Handling SSR-incompatible client-only libraries |
| 16 | - Setting up social sharing meta (Open Graph, Twitter Cards) |
| 17 | - Working with Satori for image generation (NEVER use React) |
| 18 | |
| 19 | ## Rule Categories by Priority |
| 20 | |
| 21 | | Priority | Category | Impact | Prefix | |
| 22 | | -------- | ------------------------- | -------- | --------- | |
| 23 | | 1 | OG Image Generation | CRITICAL | `og-` | |
| 24 | | 2 | Page SEO & Meta | HIGH | `meta-` | |
| 25 | | 3 | Structured Data | MEDIUM | `schema-` | |
| 26 | | 4 | Cloudflare & Nitro Config | HIGH | `cf-` | |
| 27 | |
| 28 | ## Quick Reference |
| 29 | |
| 30 | ### 1. OG Image Generation (CRITICAL) |
| 31 | |
| 32 | - `og-cf-workers` - Generate dynamic OG images on Cloudflare Workers with @cf-wasm/og |
| 33 | - `og-no-react` - Use plain JS objects for Satori elements, NEVER React |
| 34 | - `og-cache-headers` - Cache OG images with immutable headers for CDN |
| 35 | - `og-corp-cross-origin` - Serve OG images with CORP cross-origin or every social card silently breaks |
| 36 | |
| 37 | ### 2. Page SEO & Meta (HIGH) |
| 38 | |
| 39 | - `meta-use-page-seo` - Reusable composable for consistent page-level SEO |
| 40 | - `meta-social-tags` - Proper Open Graph and Twitter Card meta tags |
| 41 | - `meta-canonical-url` - Canonical URLs and og:url for every page |
| 42 | |
| 43 | ### 3. Structured Data (MEDIUM) |
| 44 | |
| 45 | - `schema-json-ld` - JSON-LD structured data in app.vue for Google Rich Results |
| 46 | |
| 47 | ### 4. Cloudflare & Nitro Config (HIGH) |
| 48 | |
| 49 | - `cf-compatibility-date` - Pin compatibilityDate, never use 'latest' |
| 50 | - `cf-nitro-config` - Nitro config for CF Pages (nodeCompat, process.stdout, WASM) |
| 51 | - `cf-ssr-externals` - SSR external config for client-only libraries |
| 52 | - `cf-wasm-import` - WASM module configuration for Cloudflare Workers |
| 53 | |
| 54 | ## How to Use |
| 55 | |
| 56 | Read individual rule files for detailed explanations and code examples: |
| 57 | |
| 58 | ``` |
| 59 | rules/og-cf-workers.md |
| 60 | rules/meta-use-page-seo.md |
| 61 | rules/_sections.md |
| 62 | ``` |
| 63 | |
| 64 | Each rule file contains: |
| 65 | |
| 66 | - Brief explanation of why it matters |
| 67 | - Incorrect code example with explanation |
| 68 | - Correct code example with explanation |
| 69 | - Additional context and Nuxt/Cloudflare-specific notes |
| 70 | |
| 71 | ## Full Compiled Document |
| 72 | |
| 73 | For the complete guide with all rules expanded: `AGENTS.md` |
People who liked this also viewed
6 picksType
- seo-auditWhen the user wants to audit, review, or diagnose SEO issues on their site. Also use when the user mentions "SEO audit," "technical SEO," "why am I not ranking," "SEO issues," "on-page SEO," "meta tagSkillsJul 2026
- copywritingWhen the user wants to write, rewrite, or improve marketing copy for any page — including homepage, landing pages, pricing pages, feature pages, about pages, or product pages. Also use when the user sSkillsJul 2026
- marketing-psychologyWhen the user wants to apply psychological principles, mental models, or behavioral science to marketing. Also use when the user mentions 'psychology,' 'mental models,' 'cognitive bias,' 'persuasion,'SkillsJul 2026
- content-strategyWhen the user wants to plan a content strategy, decide what content to create, or figure out what topics to cover. Also use when the user mentions "content strategy," "what should I write about," "conSkillsJul 2026
- programmatic-seoWhen the user wants to create SEO-driven pages at scale using templates and data. Also use when the user mentions "programmatic SEO," "template pages," "pages at scale," "directory pages," "location pSkillsJul 2026
- marketing-ideasWhen the user needs marketing ideas, inspiration, or strategies for their SaaS or software product. Also use when the user asks for 'marketing ideas,' 'growth ideas,' 'how to market,' 'marketing stratSkillsJul 2026
