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

news2024/12/23 13:34:26

文章目录

    • 导读
      • 开发环境
    • 安装Vs code插件:Doxygen Documentation Generator
      • 效果
      • 优势
    • jsdoc-to-markdown的使用
      • 了解 jsdoc
      • jsdoc-to-markdown安装
      • 创建测试文件example.js
      • jsdoc-to-markdown使用
      • jsdoc-to-markdown踩坑!!!
    • 参考资料

导读

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

开发环境

版本号描述
文章日期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
        }
    }
}


参考资料

  • Vs code自动生成Doxygen格式注释 https://www.cnblogs.com/silencehuan/p/11875958.html
  • jsdoc-to-markdown官网 https://github.com/jsdoc2md/jsdoc-to-markdown
  • 踩坑原文 https://stackoverflow.com/questions/64978721/js-includepattern-not-working-there-are-no-input-files-to-process

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1219.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【C++】一文带你吃透string的模拟实现 (万字详解)

🌈欢迎来到C专栏~~ 模拟实现string (꒪ꇴ꒪(꒪ꇴ꒪ )🐣,我是Scort🎓🌍博客主页:张小姐的猫~江湖背景快上车🚘,握好方向盘跟我有一起打天下嘞!送给自己的一句鸡汤🤔&#…

生态流量智能终端机 水电站生态流量多媒体智能终端-视频叠加、数据采集、远程传输

平升电子生态流量智能终端机 水电站生态流量多媒体智能终端是一款集人机交互、视频叠加、4G路由、数据采集、逻辑运算与远程传输功能于一体的多媒体智能终端设备。 此款产品为水电站生态流量监测项目的专用产品,便于监管单位及时掌握水电站的流量下泄情况&#xff…

【Django框架】——19 Django视图 01 路由配置

文章目录一、视图介绍二、路由配置1. 配置URLconf2.编辑项目中urls.py(根路由)3.创建应用中 urls.py (子路路由)4.路由文件urls.py5.API讲解一、视图介绍 视图就是应⽤用中views.py⽂文件中的函数 视图的第⼀个参数必须为HttpRequest对象,还…

计算多张图片的移位距离

( A, B )---25*30*2---( 1, 0 )( 0, 1 ) 做一个二分类的网络分类A和B,让A和B的训练集中都有多张图片,用一种平均值的办法把多张图片等效成两张图片,统计两张图片的移位距离,并比较移位距离和迭代次数的关系。 设AB训练集都只有两…

Python编程 赋值,逻辑,位运算符

作者简介:一名在校计算机学生、每天分享Python的学习经验、和学习笔记。 座右铭:低头赶路,敬事如仪 个人主页:网络豆的主页​​​​​​ 目录 前言 一.赋值运算符 1.基本赋值运算符 2.注意 二.逻辑运算符 1.逻辑运算符使…

【LeetCode】No.70. Climbing Stairs -- Java Version

题目链接:https://leetcode.com/problems/climbing-stairs/ 1. 题目介绍(Climbing Stairs) You are climbing a staircase. It takes n steps to reach the top. 【Translate】: 你正在爬楼梯,爬到山顶要走n步。 Each…

最受欢迎的职业榜单!医生还是程序员?

最受欢迎的男友职业排行榜终于更新了,医生荣归榜首成为了第一名。 出人意外的是,公务员竟然只排名第六。 榜单上可以看出程序员也霸榜,占据了排行前三的位置。 程序员相对于医生有什么样的优势呢? 首先是逻辑分析能力。 虽然医生…

CMSC5707-高级人工智能之自编码器Auto-encoders

这章讲述模型框架和概念的时间较多,好像并没有涉及过多的运算,重在一些概念的理解。 Traditional Autoencoder 传统的自编码器常用来进行图像去噪的任务,需要了解其模型架构和流程。 自编码器由两部分组成:从Noisy Input到Z称为…

【附源码】计算机毕业设计java学生社团管理系统设计与实现

项目运行 环境配置: Jdk1.8 Tomcat7.0 Mysql HBuilderX(Webstorm也行) Eclispe(IntelliJ IDEA,Eclispe,MyEclispe,Sts都支持)。 项目技术: SSM mybatis Maven Vue 等等组成,B/S模式 M…

Python Flask教程学习02

书接上文Python Flask教程学习01 文章目录Flask 教程Flask 会话Flask 消息闪现Flask 文件上传Flask 扩展/寻找扩展Flask 教程 Flask 会话 与Cookie不同,Session(会话)数据存储在服务器上。会话是客户端登录到服务器并注销服务器的时间间隔。…

jmap:java内存映像工具【详细】

目录jmap概述:jmap 命令格式jmap -heap mid-histo[:live] midjmap -finalizerinfo midjamp -dump:[live,] formatb,filejmap概述: jmap命令用于生成堆转储快照j。jmap的作用不仅仅是为了获取dump文件,它还可以查询finalize执行对垒、java堆和…

【转】推送消息推送机制

原文链接:推送消息&推送机制 - 知乎 消息推送(push)用一句话解释就是:服务端向客户端发送了一条消息,我们在通知栏、锁屏通知、微信消息等等之类的都是消息推送。 1/推送类型有哪些? 消息推送根据业…

2017年某高校848数据结构真题复习

数据是对客观事物的符号表示 元素之间的关系不同,通常由四类基本结构————集合,线性结构,树形结构,图状结构 算法的五个特性——出入确可穷 1个或多个输出0个或多个输入确定性可行性有穷性求下列程序段的时间复杂度 for(i1…

html制作一个酷炫的记事本(源码)

文章目录1.记事本风格和灵感1.1 设计灵感1.2 整体风格2.代码展示1.1 酷炫的记事本效果图1.2 主代码源码下载html制作一个酷炫的记事本(源码) 平时上班总有很多事要弄,到了下班以为都弄好了,结果缺忘记了几个。于是整了一个便签记事…

是德/安捷伦E5062A网络分析仪的常用技术及性能参数

网络分析仪作为一种测量网络参数的新型测试测量的仪器,直接测量有源或无源、可逆或不可逆的双口和单口网络的复数散射参数,以扫频方式输出各散射参数的幅度、相位频率特性,以供进行信号比较和再次利用,随着科技的发展,…

2.1.5操作系统之线程概念与多线程模型

文章目录为什么要引入线程什么是线程引入线程带来的变化及进程与线程的比较线程的属性线程的实现方式用户线程内核线程特殊的组合方式及重点注意多线程模型多对一模型一对一模型多对多模型为什么要引入线程 引入进程是为了让程序能够并发的执行,因为进程只能而引入线…

python每日学4:vscode的安装与基础使用

python开发常用的编辑器就是vscode, pycharm, 其他文本编辑器,我以前一直使用pycharm和国产的everedit. 但是,pycharm有点太笨重,everedit又太轻了,编译时经常出现字符编码集的错误,于是我就想换着使用下vscode. 首先是…

FLINK 基于1.15.2的Java开发-Watermark是怎么解决延迟数据唯一正确的生产级解决方案-目前市面上的例子都有问题

至此篇,已经完成高级生产应用,至此只剩“码需求”了。 开篇 Watermark这一块国内中文相关资料没有一篇是写完整或者写对的。源于:官网的watermark理论是对的,中文相关博客的代码和公式是错的。 很有可能是写第一篇Watermark中文…

【模电实验】【验证性实验——基本差动放大电路实验】

实验4-1 验证性实验——基本差动放大电路实验 1. 静态工作点的测试 按照下图连接电路,检查无误后将A, B两端短接,接通电源12 V, 分别测量三极管各极对地的电压值,推算静态电流,记入下表,并与仿真结果&…

【JavaWeb】之富文本编辑器

【JavaWeb】富文本编辑器前言一、富文本编辑器介绍二、富文本编辑器使用1.引入编辑器(多种引入方式)2.使用编辑器三、主流富文本编辑器推荐1.TinyMCE2.CKEditor3.UEditor4.wangEditor5.kindeditor6.simditor7.bootstrap-wysiwyg8.summernote9.Froala10.Q…