A API documentation generator for Vue3 single file component.
# for local
npm i doc-vue3
# or for global
npm i -g doc-vue3
Add a comment beginning with "@doc" as api description at the "slot", "props", "emits", "methods" declarations in the code.
<template>
<div class="component-crt-crud">
<!-- @doc the custom actions buttons -->
<slot name="customAction"></slot>
<!-- @doc the modal content -->
<slot name="modal"></slot>
</div>
</template>
<script lang="ts">
import { defineComponent} from 'vue';
export default defineComponent({
props: {
// @doc name of crud
crudName: {
type: String,
default: '',
},
// @doc modal form fieds
modalFormSchema: {
type: Array as PropType<SearchSchema[]>,
default: () => [],
},
},
emits: [
// @doc download button click event
'downloadClick',
],
setup() {
return {};
},
methods: {
/**
* @doc show detal
* @param record detail data object
*/
async show(record: BaseObject) {
//...
},
// @doc fetch table data
async fetchList() {
//...
},
},
});
</script>
docvue xxx.vue xxx.json
"xxx.vue" is the path of your vue file , "xxx.json" is the path of your API documentation file.
Based on the suffix of the input documentation file, the API documentation will be automatically generated in one of the following formats: "json\md\html", the default is "json". See demo.
# Output a json documentation
docvue xxx.vue xxx.json
# Output a markdown documentation
docvue xxx.vue xxx.md
# Output a html documentation
docvue xxx.vue xxx.html
docvue is a function that accepts 2 parameters, the first is the source string and the second is the options object, returns the document data.
const docvue = require('doc-vue3')
const code = `your code`
const result = docvue(code) // by default, result is json object
const mdResult = docvue(code, { type: 'md' }) // mdResult is markdown string
const htmlResult = docvue(code, { type: 'html' }) // htmlResult is html string
Specify the type of document, input one of them: "json\md\html",default is "json"
MIT