markdown-it-demo 插件 首先,demo 引用肯定是首要任务,因为它更容易解决,而且能给 iframe 做铺垫,element-plus和vitepress-for-component给了我很大的帮助。 element-plus element-plus 使用 markdown-it-container 创建了一个自定义容器,使用方式类似于: ::: demo alert/demo.vue ::: 这里的:::是容器的边界,...
自定义容器是MD文档默认并不支持的一种语法,在Vuejs的文档有很多的应用,实现自定义容易需要用到markdown-it-container模块~ markdownIt通过插件的形式利用markdown-it-container来实现自定义容器,通过配置validate来做渲染前的语法校验,通过render函数来组中容器部分的HTML结构~ ::: warning *here be dragons* :::...
自定义容器是MD文档默认并不支持的一种语法,在Vuejs的文档有很多的应用,实现自定义容易需要用到markdown-it-container模块~ markdownIt通过插件的形式利用markdown-it-container来实现自定义容器,通过配置validate来做渲染前的语法校验,通过render函数来组中容器部分的HTML结构~ 代码语言:javascript 复制 ::: warning...
import container from 'markdown-it-container' // https://github.com/vuejs/vitepress/blob/main/src/node/markdown/plugins/containers.ts // [typeof container, string, { render: RenderRule }] type ContainerArgs = [any, string, { render: Function }] export function createContainer( klass: str...
在VitePress 项目中,Mermaid 通常是通过一个插件来集成的,这个插件是 @vitejs/plugin-markdown-it-container 和markdown-it-mermaid 的组合。不过,VitePress 本身已经内置了对 Mermaid 的支持,所以你只需要确保你的 VitePress 版本支持 Mermaid 即可。通常,这意味着你需要安装一个较新版本的 VitePress。 如果你的项目...
import mdContainer from 'markdown-it-container'; import path from 'node:path'; import fs from 'node:fs'; import vueJsx from '@vitejs/plugin-vue-jsx'; // https://vitepress.dev/reference/site-config export default defineConfig({ title: ' iBiz 数据大屏', description...
import{ slugify } from"@mdit-vue/shared"; const props = defineProps({ title: String, data: { type: Array, default: [], }, }); // 生成侧边栏markdown的目录 const createTitle = computed(() => { returnslugify(props.title);
npm install markdown-it-vitepress-demo --save-dev Usage // .vitepress/config.jsexportdefaultdefineConfig({markdown:{config(md){md.use(require('markdown-it-vitepress-demo'))},},}) Register your<demo-container>component intheme/index.ts|js: ...
interface ContainerOpts { marker?: string | undefined @@ -27,6 +25,7 @@ interface ContainerOpts { } export const mdPlugin = (md: MarkdownIt) => { md.use(headers) md.use(externalLinkIcon) md.use(tableWrapper) md.use(tooltip) @@ -53,10 +52,10 @@ export const mdPlugin = (md...
markdown-it: 13.0.1 markdown-it-container: 3.0.0 rimraf: 3.0.2 sass: registry.npmmirror.com/sass/1.56.2 vitepress: registry.npmmirror.com/vitepress/1.0.0-alpha.30_sass@1.56.2 vitepress-theme-vuetom: link:../vuetom packages/vuetom: ...