vitepress-demo-plugin v1.0.4

📖 介绍

vitepress-demo-plugin 是一个支持在 Vitepress 构建的站点中展示并预览代码 Demo 的插件，支持 vue/react/html 等多种语法组件的预览。

在线查看效果

• 展示 Antd 组件库：

• 展示 Element Plus 组件库：

🚀 安装

npm i vitepress-demo-plugin -D
# or
yarn add vitepress-demo-plugin -D
# or
pnpm add vitepress-demo-plugin -D

🌈 使用

1. 引入插件

   import { defineConfig } from 'vitepress';
   import { vitepressDemoPlugin } from 'vitepress-demo-plugin'; 
   import path from 'path';
   
   export default defineConfig({
     // other configs...
     markdown: { 
       config(md) { 
         md.use(vitepressDemoPlugin); 
       }, 
     }, 
   });

2. 展示 Demo

   现在你可以在 markdown 中通过 <demo /> 组件展示你的 demo 了：

   <!-- 展示 vue demo -->
   <demo vue="../demos/demo.vue" />
   
   <!-- 展示 react demo -->
   <demo react="../demos/demo.tsx" />
   
   <!-- 展示 html demo -->
   <demo html="../demos/demo.html" />

📧 交流与反馈

任何使用问题可以加入微信群或者添加作者微信 zhoulx1688888 进行咨询与反馈: