make-content-editable
Make Content Editable
Convert hardcoded Vue components found in a markdown file into slot-based, Nuxt Studio-editable MDC components.
References
Consult these files as you work through each step:
| File | When to consult |
|---|---|
references/vue-slots.md |
Slot naming conventions, props vs slots, mdc-unwrap, interactive components |
references/mdc-syntax.md |
Colon depth, indentation, slot ordering, parse errors |
references/nuxt-studio.md |
Why slots = editable regions, v-show rule |
references/nuxt-components.md |
Nuxt component auto-discovery, props, default/named slots |
references/nuxt-ui-components.md |
UPageHero/UCard slot API, :ui overrides, text-center quirk |
references/tailwind-purging.md |
Static lookup maps for color props |
More from nuxt-content/nuxt-studio
nuxt-content
Use when working with Nuxt Content v3 - provides collections (local/remote/API sources), queryCollection API, MDC rendering, database configuration, NuxtStudio integration, hooks, i18n patterns, and LLMs integration
115nuxt
Use when working on Nuxt 4+ projects - provides server routes, file-based routing, middleware patterns, Nuxt-specific composables, and configuration with latest docs. Covers h3 v1 helpers (validation, WebSocket, SSE) and nitropack v2 patterns.
58nuxt-ui
Use when building styled UI or working with @nuxt/ui v4 components (Button, Modal, Form, Table, etc.) - provides ready-to-use components with Tailwind Variants theming. Use vue skill for raw component patterns, reka-ui for headless primitives.
54vue
Use when editing .vue files, creating Vue 3 components, writing composables, or testing Vue code - provides Composition API patterns, props/emits best practices, VueUse integration, and reactive destructuring guidance
48nuxt-modules
Use when creating Nuxt modules: (1) Published npm modules (@nuxtjs/, nuxt-), (2) Local project modules (modules/ directory), (3) Runtime extensions (components, composables, plugins), (4) Server extensions (API routes, middleware), (5) Releasing/publishing modules to npm, (6) Setting up CI/CD workflows for modules. Provides defineNuxtModule patterns, Kit utilities, hooks, E2E testing, and release automation.
35document-writer
Use when writing blog posts or documentation markdown files - provides writing style guide (active voice, present tense), content structure patterns, and MDC component usage. Overrides brevity rules for proper grammar. Use nuxt-content for MDC syntax, nuxt-ui for component props.
31