【jsdoc-to-markdown】一步步实现js文件的文档生成

导读

这个需求有点怪,之前基本都是后台生成文档,前端对接就行了。
不过当团队大了,或者异地办公等原因,导致前端也需要进行对接,因此有了这篇文章。

开发环境

版本号描述
文章日期2022-10-27
操作系统Win10-1607
nvm version1.1.9
node -vv12.22.12npm -v (6.14.16)
IDEA2021.3

安装Vs code插件:Doxygen Documentation Generator

插件安装后,直接输入/**,会自动弹出注释的选项,我们选择Document This的选项。如下图:
在这里插入图片描述

效果

  /**
   * 功能设置:
   *
   * @example
   *    await setValue('mega_money', true);
   * @param {*} target
   * @param {*} arg
   * @param {string} [source='']
   * @param {number} [cheatId=0]
   * @returns undefined
   * @memberof Trainer
   */
  async setValue(target, arg, source='', cheatId=0) {

优势

  • 支持多种语言
  • 自动识别参数及类型

jsdoc-to-markdown的使用

了解 jsdoc

jsdoc-to-markdown基于jsdoc实现的,可以参考文章《jsdoc接口文档生成器》https://blog.csdn.net/youlinhuanyan/article/details/105667770

jsdoc-to-markdown安装

全局安装:
npm install -g jsdoc-to-markdown

创建测试文件example.js

/**
 * A quite wonderful function.
 * @param {object} - Privacy gown
 * @param {object} - Security
 * @returns {survival}
 */
function protection (cloak, dagger) {}

jsdoc-to-markdown使用

单文件:jsdoc2md example.js
多文件:jsdoc2md -f example.js example2.js > all.md

编程方式实现
https://github.com/jsdoc2md/jsdoc-to-markdown/wiki/How-to-create-one-output-file-per-class

'use strict'
const jsdoc2md = require('jsdoc-to-markdown')
const fs = require('fs')
const path = require('path')

/* input and output paths */
const inputFile = 'example.js'
const outputDir = __dirname

/* get template data */
const templateData = jsdoc2md.getTemplateDataSync({ files: inputFile })

/* reduce templateData to an array of class names */
const classNames = templateData.reduce((classNames, identifier) => {
  if (identifier.kind === 'class') classNames.push(identifier.name)
  return classNames
}, [])

/* create a documentation file for each class */
for (const className of classNames) {
  const template = `{{#class name="${className}"}}{{>docs}}{{/class}}`
  console.log(`rendering ${className}, template: ${template}`)
  const output = jsdoc2md.renderSync({ data: templateData, template: template })
  fs.writeFileSync(path.resolve(outputDir, `${className}.md`), output)
}

jsdoc-to-markdown踩坑!!!

上面说的是官网教程,不过执行完后,小编的电脑会报下面的错误:
JSDOC_ERROR: There are no input files to process.
在这里插入图片描述

众里寻他千百度,终于在stackoverflow上找到了答案:
在这里插入图片描述

我的jsdoc是全局安装的,配置文件所在目录为J:\Users\Administrator\AppData\Roaming\nvm\v12.22.12\node_modules\jsdoc-to-markdown\node_modules\jsdoc
|
everything全局搜索文件jsdoc\conf.json.EXAMPLE所在目录就是了,创建个文件名为conf.json的配置,填入下面配置:

{
    "tags": {
        "allowUnknownTags": true
    },
    "source": {
        "include": ["."]
    },
    "plugins": [],
    "templates": {
        "cleverLinks": false,
        "monospaceLinks": false,
        "default": {
            "outputSourceFiles": true
        }
    }
}


参考资料

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

夜猫逐梦

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值