{"id":13701385,"url":"https://github.com/propellant/doctor","last_synced_at":"2025-05-04T21:30:47.782Z","repository":{"id":65411512,"uuid":"92505727","full_name":"propellant/doctor","owner":"propellant","description":"quick and easy documentation of Vue.js components - DEPRECATED","archived":true,"fork":false,"pushed_at":"2018-10-23T10:32:51.000Z","size":410,"stargazers_count":227,"open_issues_count":4,"forks_count":21,"subscribers_count":7,"default_branch":"master","last_synced_at":"2024-11-13T07:35:50.536Z","etag":null,"topics":["component","documentation","props","vuejs"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":false,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/propellant.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-05-26T11:49:10.000Z","updated_at":"2023-11-03T15:22:21.000Z","dependencies_parsed_at":"2023-01-23T10:54:59.892Z","dependency_job_id":null,"html_url":"https://github.com/propellant/doctor","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/propellant%2Fdoctor","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/propellant%2Fdoctor/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/propellant%2Fdoctor/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/propellant%2Fdoctor/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/propellant","download_url":"https://codeload.github.com/propellant/doctor/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252403733,"owners_count":21742427,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["component","documentation","props","vuejs"],"created_at":"2024-08-02T20:01:34.777Z","updated_at":"2025-05-04T21:30:47.285Z","avatar_url":"https://github.com/propellant.png","language":"JavaScript","funding_links":[],"categories":["JavaScript","叫研发工具组"],"sub_categories":["文档"],"readme":"# propdoc [![Build Status](https://travis-ci.org/propellant/doctor.svg?branch=master)](https://travis-ci.org/propellant/doctor)\n\n\u003e quick and easy documentation of Vue.js components\n\n#### installation\n\n`npm install --save propdoc`\n\n#### example output\n\nThis example was solely generated based on the extra fields described below.\n\n![screenshot](https://github.com/propellant/doctor/blob/master/exampleOutput.png)\n\n#### features\n\n_propdoc_ proposes a new way of documenting Vue components, by including some (or all) of the documentation in the component itself.\n\nBenefits:\n- _props_ can be directly annotated, making documentation essentially the same as commenting a prop\n- Documentation can live directly in the component - thus centralizing the documentation and hopefully helping the development/documentation cycle\n\nDownsides:\n- If all documentation is built into the options object, the component will use additional space\n  - This can be mitigated by externalizing the larger proposed keys such as `description` and `token`\n\n## new keys for your components\n\nThis example showcases all of what _propdoc_ would parse, however, none are required to be used and will not be output if absent.\n\n```javascript\nexport default {\n  name: 'checkbox',\n  introduction: 'an amazing checkbox',\n  description: `\n  This \\`checkbox\\` is amazing, you should _check_ it out.\n  `,\n  token: \"\u003ccheckbox label='foo'\u003e\u003c/checkbox\u003e\",\n  props: {\n    label: {\n      type: String,\n      default: '',\n      note: \"a label to be appended after the checkbox\"\n    }\n  }\n}\n```\n\n#### note\n\n_note_ is used alongside expanded (object-style) props to describe that prop in more detail\n\n#### introduction\n\na brief summary of what the component is or does\n\n#### description\n\na more in-depth documentation of the component, will be parsed using Markdown. Note that code will need to be escaped if it's inside of a Javascript string literal.\n\n#### token\n\na quick example of the component's actual use, great for providing a way to quickly copy/paste in the future\n\n\n## use in your documentation\n\n```Vue\n\u003cscript\u003e\nimport propDoc from 'propdoc'\nimport myComponent from './myComponent.vue'\n\nexport default {\n  components: { propDoc },\n  // bind your component to use propdoc's native template output\n  data() {\n    return { documentMe: myComponent }\n  },\n  // or call getDoc() and use the same data in your own template\n  computed: {\n    myComponentDoc() { return propDoc.getDoc(myComponent) }\n  }\n}\n\u003c/script\u003e\n\n\u003ctemplate\u003e\n  \u003csection\u003e\n    \u003cprop-doc :component=\"documentMe\"\u003e\u003c/prop-doc\u003e\n    \u003cdiv\u003e\n      \u003ch1\u003e{{ myComponentDoc.name }}\u003c/h1\u003e\n      \u003cp\u003e{{ myComponentDoc.introduction }}\u003c/p\u003e\n    \u003c/div\u003e\n  \u003c/section\u003e\n\u003c/template\u003e\n```\n\n#### props\n\n- `component`: **required** and should be the component object itself\n- `documentation`: optional, can be any subset of `component`, and will take precedence; useful for two functions\n  - if the component's name or other fields should be output differently for documentation\n  - for the optional documentation fields, as these will cause some additional space to be used by your components if not separated\n\n#### slots\n\nTwo named slots are available for adding content to what _propdoc_ emits\n- `pre-use` will add content before the _description_ and _token_ fields\n- `pre-props` will add content before the prop tables are emitted\n\n#### propDoc.getDoc\n\n\u003e available in v0.8 onward\n\n`propDoc.getDoc(component, documentation)`\n\n- merges the arguments passed to it, then processes them as described above in _keys_\n- the `props` object will be converted into an array instead of an object to simplify parsing in your template\n  - essentially this means you can do `v-for=\"prop in myDocumentedComponent.props\"` and then `prop.name` instead of having to separate out the key/value\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpropellant%2Fdoctor","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fpropellant%2Fdoctor","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fpropellant%2Fdoctor/lists"}