项目作者: Kocal

项目描述 :
📖 A JSDoc plugin for documenting .vue files.
高级语言: JavaScript
项目地址: git://github.com/Kocal/jsdoc-vuejs.git
创建时间: 2017-08-10T19:47:21Z
项目社区:https://github.com/Kocal/jsdoc-vuejs

开源协议:MIT License

下载


JSDoc for VueJS

npm version
Build Status (Travis)
Build Status (AppVeyor)
codecov
Codacy Badge

A JSDoc plugin for listing props, data, computed data, and methods from .vue files.

:warning: This branch is for Vue 3. If you still use Vue 2, please see 3.x branch.


Requirements

  • Node 10+
  • Vue 3

Installation

  1. $ npm install --save-dev jsdoc jsdoc-vuejs

You also need to install @vue/compiler-sfc that match your Vue version:

  1. $ npm install --save-dev @vue/compiler-sfc

Usage

Your should update your JSDoc configuration to enable JSDoc-VueJS:

  1. {
  2. "plugins": [
  3. "node_modules/jsdoc-vuejs"
  4. ],
  5. "source": {
  6. "includePattern": "\\.(vue|js)$"
  7. }
  8. }

Update your .vue files with one of the following tags:

All of those tags work the same way than @param tag.

  1. <template>
  2. <div>Hello world!</div>
  3. </template>
  4. <script>
  5. /**
  6. * @vue-prop {Number} initialCounter - Initial counter's value
  7. * @vue-prop {Number} [step=1] - Step
  8. * @vue-data {Number} counter - Current counter's value
  9. * @vue-computed {String} message
  10. * @vue-event {Number} increment - Emit counter's value after increment
  11. * @vue-event {Number} decrement - Emit counter's value after decrement
  12. */
  13. export default {
  14. props: {
  15. initialCounter: {
  16. type: Number,
  17. required: true,
  18. },
  19. step: {
  20. type: Number,
  21. default: 1,
  22. },
  23. },
  24. data () {
  25. return {
  26. counter: 0,
  27. }
  28. },
  29. computed: {
  30. message() {
  31. return `Current value is ${this.counter}`;
  32. }
  33. },
  34. methods: {
  35. increment() {
  36. this.counter += 1;
  37. this.$emit('increment', this.counter);
  38. },
  39. decrement() {
  40. this.counter -= 1;
  41. this.$emit('decrement', this.counter);
  42. }
  43. }
  44. }
  45. </script>

Supported templates

The rendering engine has been rewritten in v2, it can supports every JSDoc templates that exists.

Actually, it supports 4 templates:

If you use a template that is not supported, it will use the default one as a fallback.

Feel free to open an issue/pull request if your template is not supported!


Default




Docstrap




Minami




Tui



Testing

Install Dependencies

  1. $ git clone https://github.com/Kocal/jsdoc-vuejs
  2. $ cd jsdoc-vuejs
  3. $ yarn install
  4. # For testing the example docs
  5. $ cd example
  6. $ yarn install

Generate documentations

  1. $ cd example
  2. # Generate docs for every renderer
  3. $ yarn docs:all
  4. # or one by one
  5. $ yarn docs # default jsdoc template
  6. $ yarn docs:docstrap
  7. $ yarn docs:minami
  8. $ yarn docs:tui

Unit

  1. $ yarn test

E2E

Before running integration tests with Cypress,
you should generate documentation with all renderers:

  1. $ cd example
  2. $ yarn docs:all

And then run Cypress:

  1. $ cd ..
  2. $ yarn cypress run

License

MIT.