@mdit-vue/plugin-sfc

@mdit-vue/plugin-sfc

A markdown-it plugin to help transforming markdown to Vue SFC.

• Extract all SFC blocks except <template> from rendered result to markdown-it env.sfcBlocks.
• Support extracting custom blocks.

Install

npm i @mdit-vue/plugin-sfc

Usage

This plugin will only take effects when the html option of markdown-it is enabled:

import MarkdownIt from 'markdown-it';
import { sfcPlugin } from '@mdit-vue/plugin-sfc';
import type { MarkdownItEnv } from '@mdit-vue/shared';

const md = MarkdownIt({ html: true }).use(sfcPlugin);
const env: MarkdownItEnv = {};

const rendered = md.render(
  `\
# foo

<script>
console.log('bar')
</script>
`,
  env,
);

const sfc = `<template>${rendered}</template>${env.sfcBlocks}`;