1、全局安装jsdoc,需要先安装node环境哦~

npm install -g jsdoc

2、在项目根目录新建文件conf.json,内容如下:

{
"tags": {
"allowUnknownTags": true,
// 指定所用词典
"dictionaries": [
"jsdoc"
]
},
// 查找文件的深度 需要用 -r 参数
"recurseDepth": 10,
"source": {
"include": [
// 需要编译的文件路径 使用时请替换
"./src"
],
// 需要编译的文件类型,根据需求设置
"includePattern": ".+\\.(js||vue)$",
"excludePattern": "(^|\\/|\\\\)_"
},
// 使用插件,不是必须,如果只编译js文档,可不设置,编译vue文件需要安装jsdoc-vue模块
"plugins": [
// 插件路径,编译vue文件需要使用jsdoc-vue插件
"./jsdoc-vue"
],
"templates": {
"cleverLinks": false,
"monospaceLinks": true,
"useLongnameInNav": false,
"showInheritedInNav": true
},
"opts": {
// 文档输出路径
"destination": "./example",
"encoding": "utf8",
"private": true,
"recurse": true,
// 使用模板 minami,需要先下载npm install -d minami
"template": "./node_modules/minami"
}
}

3、编译命令,运行命令生成html文档,文档目录在conf.json里设置

jsdoc -c conf.json

把README.md文件设为主页(home)
jsdoc -c conf.json README.md

4、本地安装jsdoc-vue

npm install -d jsdoc-vue

5、项目根目录新建jsdoc-vue.js文件,内容:

var compiler = require('vue-template-compiler');
exports.handlers = {
// 利用 vue-template-compiler 编译 vue 模板
beforeParse: function (e) {
if (/\.vue$/.test(e.filename)) {
var output = compiler.parseComponent(e.source); e.source = output.script ? output.script.content : '';
}
}
};

6、jsdoc使用文档请查看:https://www.html.cn/doc/jsdoc/about-namepaths.html

结尾~

js开发文档生成工具jsdoc安装使用的更多相关文章

  1. 开发文档生成工具----强大的Doxygen工具使用手册

    张三:假如我们自己开发了一个类库,怎么做一个方便阅读的文档呢? 李四:一个方法一个方法地写呗,就像写Excel文档一下. 张三:啊,你out了,这多慢呀.为什么不玩玩doxygen工具,它能帮你生成文 ...

  2. vue.js 开发文档

    一.安装 node.js 首先需要安装node环境,可以直接到中文官网http://nodejs.cn/下载安装包. 只是这样安装的 node 是固定版本的,如果需要多版本的 node,可以使用 nv ...

  3. 工具(5): 极简开发文档编写(How-to)

    缘起 一个合格的可维护项目,必须要有足够的文档,因此一个项目开发到一定阶段后需要适当的编写文档.项目的类型多种多样,有许多项目属于内部项目,例如一个内部的开发引擎,或者一个本身就是面向开发者的项目. ...

  4. .NET6使用DOCFX自动生成开发文档

    本文内容来自我写的开源电子书<WoW C#>,现在正在编写中,可以去WOW-Csharp/学习路径总结.md at master · sogeisetsu/WOW-Csharp (gith ...

  5. 项目管理之 使用 appledoc 生成开发文档

    写项目时通常会遇到要求写开发文档的需求,但是就源代码来说,文档最好和源码在一起,这样更新起来更加方便和顺手.Objective-C 有一些文档管理工具,doxygen, headdoc 和 apple ...

  6. [技巧]使用Xcode集成的HeaderDoc自动生成注释和开发文档

    [技巧]使用Xcode集成的HeaderDoc自动生成注释和开发文档     Doxygen本来是一个很好的工具,可是我感觉在mac系统下,如果用doxygen最后生成的CHM文件感觉就不是那么恰当, ...

  7. windows下使用 ApiGen 生成php项目的开发文档

    之前使用 PHPDocument 生成过开发文档,但是界面看着不爽,遂尝试了 ApiGen 生成,不得不说界面看着舒服多了,下面说说安装和使用的方法. ApiGen官网: http://www.api ...

  8. iOS开发-开发文档安装

    iOS开发肯定离不开开发文档,苹果有在线帮助文档,xCode其实可以下载模拟器文档和iOS8.1文档的,不过下载的速度实在不敢恭维,而且比较头疼的是不显示下载进度条的,苹果的开发文档都是放在)/应用程 ...

  9. So注入工具TsoInject开发文档

    So注入工具TsoInject开发文档 导语: 作为一个软件安全从业者而言,我们需要对某个App的关键函数就行Hook, 对于android而言,Smali层我们使用Xposed Hook框架,So层 ...

随机推荐

  1. 【struts2】中method={1}详解

    我们在使用struts2的时候,有时候为了简化struts2的配置项而采用通配符的方式,如下代码: <action name="ajaxregister!*" class=& ...

  2. Java静态变量、静态块、构造块、构造函数、main函数、普通代码块的执行顺序

    测试代码 public class SingleTest { public static String v = "StaticValue"; static { System.out ...

  3. iOS数据持久化方式及class_copyIvarList与class_copyPropertyList的区别

    iOS数据持久化方式:plist文件(属性列表)preference(偏好设置)NSKeyedArchiver(归档)SQLite3CoreData沙盒:iOS程序默认情况下只能访问自己的程序目录,这 ...

  4. 使用纯swift代码文件制作framework

    因为最近我们公司的一个客户要求我们使用swift编写程序并且将API封装成framework的形式提供给他们,所以我就开始了swift实践之路. 程序编写完之后,我就琢磨怎么封装成framework的 ...

  5. linux中可以查看端口占用的方法

    在自己搭建的服务器中,经常容易出现端口被占用的问题,那么怎么知道自己的端口是否被占用了呢? 可以使用下面的方法: linux中可以查看端口占用的方法. netstat -ant | grep 80 ( ...

  6. CentOS 7 下升级OpenSSH 7.4p1到OpenSSH 8.4p1

    文章目录 一.环境介绍 二.安装配置telnet 2.1.安装telnet-server 2.2.配置telnet 2.3.配置telnet登录的终端类型 2.4.启动telnet服务 三.切换登录方 ...

  7. 一文了解如何源码编译Rainbond基础组件

    Rainbond 主要由以下三个项目组成,参考官网详细 技术架构 业务端 Rainbond-UI 和 Rainbond-Console 合起来构成了业务层.业务层是前后端分离模式.UI是业务层的前端代 ...

  8. Python-Flask框架之"图书管理系统"项目,附详解源代码及页面效果截图

    该图书管理系统要实现的功能如下: 1. 可以通过添加窗口添加书籍或作者,如果要添加的作者和书籍已存在于书架上, 则给出相应的提示: 2. 如果要添加的作者存在,而要添加的书籍书架上没有,则将该书籍添加 ...

  9. maven项目 mvn clean install 或 build,报错:Failed to execute goal org.apache.maven.plugins:maven-surefire-plugin:2.12.4:test

    解决办法 在pom文件中添加

  10. Android 连接蓝牙扫码器 无输入框

    Android 的APP 需要集成一个蓝牙扫码器, 特别的是,需要扫码的地方是没有输入框的(EditText),不能通过直觉上理解的通过对EditText输入事件进行监听处理,取得扫码结果.并且设备也 ...