Vuepress2中如何在md文件中添加自定义组件

使用方法

npm i -D @vuepress/plugin-register-components

创建文件夹:.vuepress/components

.vuepress/config.ts

配置

import { registerComponentsPlugin } from "@vuepress/plugin-register-components";

plugins: [
    registerComponentsPlugin({
      componentsDir: path.resolve(__dirname, "./components"),
  }),
],

简单使用方法: 配置componentsDir后，会将components目录下的.vue主键自动注册，无需配置name,在.md文件中直接使用.vue文件名为标签即可

更多配置项

使用

创建文件/.vuepress/components/Demo.vue

无需注册名称

<template>
  <div><h1>这是一个测试自定义组件的demo</h1></div>
</template>
<script>
export default {};
</script>
<style></style>

创建文章docs/posts/测试文章.md

<Demo></Demo>