@ruabick/md-demo-plugins
与 @ruabick/vitepress-demo-block
配合使用在 VirePress 里面支持demo-block
。
安装插件 pnpm add @ruabick/md-demo-plugins -D
// .vitepress/config.js
import { applyPlugins } from '@vue-hooks-plus/md-demo-plugins'
export default defineConfig({
markdown: {
config: md => {
applyPlugins(md)
},
},
})
安装插件 pnpm add @vue-hooks-plus//vitepress-demo-block -D
// docs/.vitepress/theme/index.ts
import DemoBlock from '@vue-hooks-plus//vitepress-demo-block'
import '@vue-hooks-plus//vitepress-demo-block/dist/style.css'
export default {
...DefaultTheme,
enhanceApp({ app, router, siteData }) {
app.component('demo', DemoBlock)
},
}
VitePress
默认 Code Blocks
是黑色,与 demo 样式不太符合,所以建议修改 Code Blocks
样式。