1.0.0 • Published 4 years ago

abm-components-docs v1.0.0

Weekly downloads
-
License
ISC
Repository
-
Last release
4 years ago

vue组件自动生成文档

此插件利用jsdoc注释api开发,适用于vant-cli创建组件库文档信息,如是jsdoc重度使用者,有一些描述名可能会词不达意,请小心使用

使用

npm install --save-dev abm-components-docs
"script": "node_modules/abm-components-docs/index.js"

在package.json同级目录创建 docs-config.js

module.exports = {
  src: 'src/**/*.js'
}

组件描述

/**
* @exports demo-button 组件名 必须
* @classdesc 中文组件名
* @description DemoButton 是一个示例按钮组件 组件描述信息
*/
export default {
  name: 'abm-panel'
}

props

需按如下格式书写

props: {
  /**
   * @kind props 必须写成kind props
   * @type {(string|Array)}
   * @default `primary`
   * @description 类型
   */
  type: {
    type: [String, Array],
    default: 'primary'
  }
}

事件

/**
 * @event click
 * @emits doc 必须填写为 doc
 * @description 点击事件
 * @param {object|string|Function} 事件参数 参考jsdoc @param
 */
this.$emit('click', this)

slots

render() {

  /**
   * @name default
   * @kind slot
   * @description 默认插槽
   */
  return (
    <div>
      {this.$slots.default}
    </div>
  )
}

demo 代码生成

在组件demo文件中新增index.vue

<template>
  <demo-section>
    <!-- 需按照如下格式书写 -->
    <demo-block title="基础用法">
      <demo-button>按钮</demo-button>
    </demo-block>
  </demo-section>
</template>

tip: js文件请单独copy