需要安装两个npm包：
yarn add docusaurus-plugin-usevue use-vue-component另一个插件地址：use-vue-component
在docusaurus.config.js文件中，添加如下配置
module.exports = {
// ...
plugins: [
//...
'docusaurus-plugin-usevue'
],
};例如有如下场景
目录结构:
+-- docs
| +-- test.vue
| +-- intro.mdxtest.vue内容：
<template>
<div class="red">
hello world, this is {{name}}
</div>
</template>
<script>
export default {
data() {
return {
name: 'peter'
}
}
}
</script>
<style>
.red {
color: red
}
</style>intro.mdx内容:
---
sidebar_position: 1
---
## Getting Started
import {uvc} from 'use-vue-component' //引入转换包
import test from './text.vue' //引入vue组件
export const HelloWorld = uvc(test) //转换
<HelloWorld/>