vue中使用js-doc的案例代码

 更新时间:2024年01月12日 15:54:43   作者:大可-  
这篇文章主要介绍了vue中使用js-doc的相关知识,本文结合实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧

安装依赖

安装vue-template-compiler

npm install ​vue-template-compiler

安装minami

npm install minami

安装js-doc

npm install js-doc

根目录下创建 .jsdoc.conf.json

内容:

{
    "tags": {
      "allowUnknownTags": true,
      // 指定所用词典
      "dictionaries": [
        "jsdoc"
      ]
    },
    // 查找文件的深度 需要用 -r 参数
    "recurseDepth": 10,
    "source": {
      "include": [
        // 需要编译的文件路径 使用时请替换
        "./src/index/packages"
      ],
      "includePattern": ".+\\.(vue)$",
      "excludePattern": "(^|\\/|\\\\)_"
    },
    // 使用插件
    "plugins": [
      // 插件路径
      "./jsdoc-vue"
    ],
    "templates": {
      "cleverLinks": false,
      "monospaceLinks": true,
      "useLongnameInNav": false,
      "showInheritedInNav": true
    },
    "opts": {
      // 文档输出路径
      "destination": "./src/index/doc",
      "encoding": "utf8",
      "private": true,
      "recurse": true,
      // 使用模板 minami
      "template": "./node_modules/minami"
    }
}

根目录创建 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 : "";
    }
  }
};

package.json

内容:

 "doc": "jsdoc -r -c .jsdoc.conf.json"

使用npm run doc 运行

到此这篇关于vue中使用js-doc的文章就介绍到这了,更多相关vue使用js-doc内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Vue组件通信之父传子与子传父详细讲解

    Vue组件通信之父传子与子传父详细讲解

    这篇文章主要介绍了React中父子组件通信详解,在父组件中,为子组件添加属性数据,即可实现父组件向子组件通信,文章通过围绕主题展开详细的内容介绍,具有一定的参考价值,需要的小伙伴可以参考一下
    2022-10-10
  • vue全局使用axios的方法实例详解

    vue全局使用axios的方法实例详解

    这篇文章主要介绍了vue全局使用axios的方法实例详解,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下
    2018-11-11
  • vue使用canvas手写输入识别中文

    vue使用canvas手写输入识别中文

    这篇文章主要介绍了vue使用canvas手写输入识别中文,工作时遇到一些项目如:系统上的输入法使用不方便,客户要求做一个嵌入web网页的手写输入法。下面我们来看看文章得具体描述吧
    2021-11-11
  • 使用Vite处理css less及postcss示例详解

    使用Vite处理css less及postcss示例详解

    这篇文章主要为大家介绍了使用Vite处理css less及postcss的示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-07-07
  • vue table表格中如何控制下拉框的显示隐藏

    vue table表格中如何控制下拉框的显示隐藏

    这篇文章主要介绍了vue table表格中如何控制下拉框的显示隐藏问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-01-01
  • 前端vue+express实现文件的上传下载示例

    前端vue+express实现文件的上传下载示例

    本文主要介绍了前端vue+express实现文件的上传下载示例,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-12-12
  • vue实现按需加载组件及异步组件功能

    vue实现按需加载组件及异步组件功能

    这篇文章主要介绍了vue实现按需加载组件和异步组件,本文通过实例代码给大家介绍的非常详细,具有一定的参考借鉴价值 ,需要的朋友可以参考下
    2019-05-05
  • vue中本地静态图片路径写法

    vue中本地静态图片路径写法

    这篇文章给大家介绍了vue中本地静态图片路径写法及Vue.js中引用图片路径的方式,需要的朋友参考下吧
    2018-03-03
  • vue2之vue.config.js最全配置教程

    vue2之vue.config.js最全配置教程

    本文主要介绍了vue2之vue.config.js最全配置教程,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2022-06-06
  • 深入理解Vue 的钩子函数

    深入理解Vue 的钩子函数

    这篇文章主要介绍了Vue 的钩子函数,本文给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2018-09-09

最新评论