How do I pass props to components in Markdown?

Props can be passed using inline curly braces {key="value"}, via a YAML block inside a block component, or as dynamic bindings using the :prefix for JavaScript expressions.

What is MDC syntax in Nuxt Content?

MDC (Markdown Components) is an extension of Markdown that allows you to use Vue components directly in your content files. It uses specific syntax like :: for block components and : for inline components.

Can I style standard Markdown elements with this skill?

Yes, MDC allows you to apply classes, IDs, and other attributes to standard Markdown like bold text, images, or links using the [text]{.class-name} syntax.

Does this skill handle Nuxt routing for content?

It provides specific patterns for avoiding route ambiguity, such as splitting implementation between index.vue and catch-all [...slug].vue files for reliable path resolution.

Nuxt Content MDC Authoring

Name: Nuxt Content MDC Authoring
Author: colinmollenhour

bycolinmollenhour

Content Management

Streamlines the creation and editing of Markdown files using MDC syntax for Nuxt Content applications.

About

This skill provides comprehensive guidance for authoring rich content within Nuxt applications using the MDC (Markdown Components) syntax. It enables developers to integrate Vue components directly into Markdown, manage YAML frontmatter metadata, and utilize advanced formatting like named slots and dynamic props. By following established patterns for Prose components and routing, this skill helps create high-quality documentation, blogs, and interactive content-driven sites while ensuring technical accuracy and best practices.

Key Features

Full MDC syntax support for block and inline Vue components
Custom attribute and CSS class application for Markdown elements
Enhanced code block configurations with highlighting and filenames
Advanced slot implementation including named and nested slots
Comprehensive frontmatter management and variable interpolation
0 GitHub stars

Use Cases

Managing complex blog structures with dynamic metadata and custom styling
Developing content-driven landing pages using flexible MDC layouts
Building interactive technical documentation with embedded Vue components

About

Key Features

Full MDC syntax support for block and inline Vue components
Custom attribute and CSS class application for Markdown elements
Enhanced code block configurations with highlighting and filenames
Advanced slot implementation including named and nested slots
Comprehensive frontmatter management and variable interpolation
0 GitHub stars

Use Cases

Managing complex blog structures with dynamic metadata and custom styling
Developing content-driven landing pages using flexible MDC layouts
Building interactive technical documentation with embedded Vue components