vite插件-自动生成vue组件文档

特点

• 支持热更新
• 快速启动，依赖于 vite，无需另起服务
• 自动生成组件导航
• ui 采用了vant-ui的样式
• 核心方法覆盖率达到了 92.86%

使用

yarn add vite-plugin-vue-docs -D

// vite.config.js

import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import vueDocs from "vite-plugin-vue-docs";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue(), vueDocs()],
});

example

git clone https://github.com/meetqy/vite-plugin-vue-docs.git
yarn
yarn dev
yarn example:dev

语法

emits,props，在vue中有对应的写法，所以只需要在写法上加上注释，插件就会自动解析。

ref

ref 一般调用的是methods当中的某一些方法，所以需要在方法上面加上@vue-docs-ref标识，并使用多行注释的方式。
注释规范参照JavaScript编码规范-函数/方法注释

export default {
  methods: {
    /**
     * @vue-docs-ref
     * @description 这是一个say方法
     * @param {string} name 姓名
     * @param {number} age  年龄
     * @return {name: string, age: number}
     */
    say(name: string, age: number) {
      return {
        name,
        age,
      };
    },
  },
};

参数说明

计划