ui5-jsdoc-generator
Creates automatic documentation for control libraries done in ui5
Install
npm install ui5-jsdoc-generator --save-dev
Setup
node ./node_modules/ui5-jsdoc-generator/bin/ui5-jsdoc-generator.js --input=inputFolder --output=outputFolder
Template
Create a file (templates/template.html) inside your web project with the following content:
@class #__CONTROL_NAME__# #__CONTROL_DESCRIPTION__# Supported settings are: Properties #__PROPERTIES__# Aggregations #__AGGREGATIONS__# Associations #__ASSOCIATIONS__# Events #__EVENTS__# In addition, all settings applicable to the base type {@link #__BASE_CLASS__#} can be used as well. @extends #__BASE_CLASS__# @author #__AUTHOR__# @version #__VERSION__# @public @alias #__CONTROL_NAME__#
JSDoc integration
ui5-jsdoc-generator can be easily integrated with jsdoc using an npm script:
Run the following commands
npm init
(note: we're creating package.json)npm install jsdoc --save-dev
npm install ui5-jsdoc-generator --save-dev
Edit the script tag of the package.json with the following information
And finally, execute npm run doc
Why ?
A common ui5 control looks like the following code -
sapui;
Everything is fine until the alarm rings with the following sound 'where is the documentation?'. No problem sir! We have a "quick" solution on mind. You go through every control in your library adding the jsdoc annotations manually. Now everything looks like:
sapui;
Why are we adding all that information manually when ui5 stores everything into the metadata ? Isn't it unnecessary ? What happends if we add a new property? We need to change the header comments once again! To avoid all those problems just change the control in the following way -
sapui;
ui5-jsdoc-generator will parse the metadata structure and generate the necessary notations for jsdoc automagically ✨