Security News
The Dark Side of Open Source
At Node Congress, Socket CEO Feross Aboukhadijeh uncovers the darker aspects of open source, where applications that rely heavily on third-party dependencies can be exploited in supply chain attacks.
jsdoc-vuex-plugin
Advanced tools
Readme
A JsDoc plugin for documenting Vuex modules.
I'm a sucker for clean and concise documentation. I used to document my Vuex modules using namespaces and typedefs already built in in JsDoc, but after a while found these mechanisms frustrating as they just could not do what I wanted them to.
This plugin creates custom tags for Vuex getters, mutations and actions.
You need to have node-js set up and configured. Next, you need to install JsDoc:
npm i -D jsdoc
After that, you should install this plugin as a global package:
npm i -g jsdoc-vuex-plugin
To enable the plugin in JsDoc, add the relevant configuration option in your jsdoc.conf:
{
"tags": {
"allowUnknownTags": true
},
"source": {
"include": ["."],
"exclude": [ "node_modules" ],
"includePattern": ".+\\.js(doc|x)?$",
"excludePattern": ""
},
"plugins": ["jsdoc-vuex-plugin"],
"templates": {
"cleverLinks": false,
"monospaceLinks": false
}
}
Run JsDoc with the --config
flag and point to the path of your jsdoc.conf.
I have not bothered to create custom tags for the Vuex state. To document the Vuex state I have selected to simply use the existing @property tag, like so:
/**
* The Vuex 'state' object.
* @name State
* @type {object}
* @property {boolean} boolProp This property is a boolean.
* @property {string} strProp This property is a string.
* @property {number} numProp This property is a number.
*/
The @getter tag uses the following syntax:
@getter {return_type} getter_name=state_property_returned And a description.
/**
* The module 'getters' object.
* @name Getters
* @type {object}
* @getter {boolean} getBoolProp=boolProp Returns a boolean property.
* @getter {string} getStrProp=strProp Returns a string property.
* @getter {boolean} getNumProp=numProp Returns a property that is a number.
*/
Name | Returns Type | Returns State Property | Description |
---|---|---|---|
getBoolProp | boolean | boolProp | Returns a boolean property. |
getStrProp | string | strProp | Returns a string property. |
getNumProp | number | numProp | Returns a property that is a number. |
The _@mutator tag uses the following syntax:
@mutator {accepts_type} mutator_name=state_property_to_mutate And a description.
/**
* The module 'setters' object.
* @name Getters
* @type {object}
* @mutator {boolean} setBoolProp=boolProp Sets the state boolean property.
* @mutator {string} setStrProp=strProp Sets the state string property.
* @mutator {number} setNumProp=numProp Sets the state numerical property.
*/
Name | Accepts Type | Mutates State Property | Description |
---|---|---|---|
setBoolProp | boolean | boolProp | Sets the state boolean property. |
setStrProp | string | strProp | Sets the state string property. |
setNumProp | number | numProp | Sets the state numerical property. |
The @action tag should not be documented liek an object, but rather like a method. I chose this approach due to their asynchronous nature.
The @action tag should be documented like this:
@action action_name=state_property_affected
/**
* Blah blah blah description.
* @action updateStrProp=strProp
* @param {string} word A string parameter for example purposes.
* @returns {void}
*/
updateStrProp({ commit }, word) {
const ajaxResult = getResult();/// Some Ajax here...
commit('setStrProp', `${word} blah blah blah ${ajaxResult}`);
}
strProp
Name | Type | Description |
---|---|---|
word | string | A string parameter for example purposes. |
Bug reports and pull requests are welcome.
MIT
To Brad van der Laan who authored the awesome jsdoc-route-plugin, a project that provides custom JsDoc tags inteded to be used when documenting Express routes, and also the project that I very shamelessly used as an example when I wrote this plugin.
FAQs
A JSDoc plug-in to document Vuex modules.
The npm package jsdoc-vuex-plugin receives a total of 206 weekly downloads. As such, jsdoc-vuex-plugin popularity was classified as not popular.
We found that jsdoc-vuex-plugin demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
At Node Congress, Socket CEO Feross Aboukhadijeh uncovers the darker aspects of open source, where applications that rely heavily on third-party dependencies can be exploited in supply chain attacks.
Research
Security News
The Socket Research team found this npm package includes code for collecting sensitive developer information, including your operating system username, Git username, and Git email.
Security News
OpenJS is warning of social engineering takeovers targeting open source projects after receiving a credible attempt on the foundation.