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. UIPickView的基本使用

    UIPickView和TableView一样,想要展示数据也要设置数据源和代理设置数据源self.pickView.dataSource = self;设置代理self.pickView.delega ...

  2. js获取 url?后面的参数取值

    function GetRequest() {     var url = location.search; //获取url中"?"符后的字串     var theRequest ...

  3. Java和Js编码(encodeUrl)解码(decodeUrl)对空格的差异问题

    今天解决一个问题的时候遇到了一个编码解码问题,记录一下. 1. Js用的是encodeURIComponent()方法编码,后面的都以该编码方式处理出来的数据为准. 2. Java用的是URLDeco ...

  4. WebGPU 中消失的 FBO 和 RBO

    目录 1 WebGL 中的 FBO 与 RBO 1.1 帧缓冲对象(FramebufferObject) 1.2 颜色附件与深度模板附件的真正载体 1.3 FBO/RBO/WebGLTexture 相 ...

  5. Ubuntu18修改系统时间

    1. 运行 tzselect 依次选择 Asia -> China -> Beijing Time 2. 复制文件到 /etc 下 sudo cp /usr/share/zoneinfo/ ...

  6. 解决/WEB-INF目录下的jsp页面引入webRoot下的Js、css和图片的问题

    通常把jsp页面放在webRoot的/WEB-INF下可以防止访问者直接输入页面. 而webRoot的/WEB-INF下的页面是受保护的,用户无法通过形如http://localhost:8080/t ...

  7. Redis和数据库的数据一致性问题

    在数据读多写少的情况下作为缓存来使用,恐怕是Redis使用最普遍的场景了.当使用Redis作为缓存的时候,一般流程是这样的. 如果缓存在Redis中存在,即缓存命中,则直接返回数据 如果Redis中没 ...

  8. Python内置模块(re+collections+time等模块)

    Python内置模块(re+collections+time等模块) 1. re模块 import re 在python要想使用正则必须借助于模块 re就是其中之一 1.1 findall功能( re ...

  9. Linux常用命令在Ubuntu 16下(个人笔记)

    可以通过 tab键来补全提示命令或者目录,终端命令的格式: 命令 [-选项,多个选项可以结合写] [参数] , 大多数情况可以通过 ctrl c 退出命令 磁盘管理 pwd 查看当前所在目录 即:pr ...

  10. 原来VIM还可以这样玩

    文章目录 配置文件vimrc vim 状态栏 状态栏配置内容 状态栏常用信息 显示状态栏 终端安全色 vimrc 配置文件 推荐 vi/vim命令大全 vim参阅 配置文件vimrc 在vim文件中执 ...