nuxt-mdc-edge v0.0.2-28214512.e5770b3

Nuxt MDC

MDC supercharges regular Markdown to write documents interacting deeply with any Vue component.

Install

# Using Yarn
yarn add --dev remark-mdc
# Using NPM
npm install --save-dev remark-mdc

Then, add nuxt-mdc to the modules section of your nuxt.config.ts

export default defineNuxtConfig({
  modules: ['nuxt-mdc']
})

Use

Parse MDC content in any environment:

import { parseMarkdown } from 'nuxt-mdc/runtime'

async function main(mdc: string) {
  const ast = await parseMarkdown(mdc)

  // Do your magic with parsed AST tree

  return ast
}

Render MDC content with <MDC> component:

<template>
  <MDC :value="md"  tag="article" />
</template>

<script setup lang="ts">
const md = `
::alert
Hello MDC
::
`
</script>

💻 Development

• Clone repository
• Install dependencies using pnpm install
• Prepare using pnpm dev:prepare
• Try playground using pnpm dev

License

MIT - Made with 💚