angular / dgeni-packages

A collection of dgeni packages for generating documentation from source code.
MIT License
142 stars 106 forks source link

Dgeni Packages

This repository contains a collection of Dgeni Packages that can be used by the Dgeni documentation generator to create documentation from source code.

Out of the box there are the following packages:

base Package

Processors

Services

Template Finding

The template used to render a doc is computed by the templateFinder, which uses the first match from a set of patterns in a set of folders, provided in the configuration. This allows a lot of control to provide generic templates for most situations and specific templates for exceptional cases.

Here is an example of some standard template patterns:

templateFinder.templatePatterns = [
  '${ doc.template }',
  '${ doc.area }/${ doc.id }.${ doc.docType }.template.html',
  '${ doc.area }/${ doc.id }.template.html',
  '${ doc.area }/${ doc.docType }.template.html',
  '${ doc.id }.${ doc.docType }.template.html',
  '${ doc.id }.template.html',
  '${ doc.docType }.template.html'
]

git Package

This package provides some git and version information to the renderDocsPocessor that is available in the templates. This code as it is was made for the angular.js document generation, including some custom logic for special versions. However, any of the services can be overridden with custom behavior.

The git information is made available to templates via the extraData.git property. See the section below to see an example usage.

Services

Using extraData.git

An example as used in git/templates/api/api.template.html

<a href='https://github.com/{$ git.info.owner $}/{$ git.info.repo $}/tree/{$ git.version.isSnapshot and 'master' or git.version.raw $}/{$ doc.fileInfo.projectRelativePath $}#L{$ doc.startingLine $}' class='view-source pull-right btn btn-primary'>
  <i class="glyphicon glyphicon-zoom-in">&nbsp;</i>View Source
</a>

nunjucks Package

This package provides a nunjucks driven implementation of the templateEngine required by the base package renderDocsPocessor. The "nunjucks" JavaScript template tool-kit to generates HTML based on the data in each document. We have nunjucks templates, tags and filters that can render links and text as markdown and will highlight code.

Services

jsdoc Package

File Readers

Processors

Tag Definitions

The jsdoc package contains definitions for a number of standard jsdoc tags including: name, memberof, param, property, returns, module, description, usage, animations, constructor, class, classdesc, global, namespace, method, type, kind, access, public, private and protected.

Services (Tag Transformations)

This package provides a number of Transform services that are used in Tag Definitions to transform the value of the tag from the string in the tag description to something more meaningful in the doc.

Templates

This package does not provide any templates nor a templateEngine to render templates (use the nunjucks package to add this).

Tag Definitions

This package provides a minimal implementation of tags from the JSDoc project. They extract the name and type from the tag description accordingly but do not fully implement all the JSDoc tag functionality.

Code Name Matchers

Matcher performs a search for a suitable code name at the given jsdoc code point (AST node). codeNameService matches AST node name against matcher name and if suitable matcher is found, executes it.

Matcher name consists of <AstNodeName> and NodeMatcher substrings, i.e. FunctionExpressionNodeMatcher then latter is stripped and matcher is used by the former part, i.e. FunctionExpression.

Matcher should accept single argument - node and return either string with name or literal null.

Matchers:

ngdoc Package

The ngdoc Package depends upon the jsdoc and nunjucks packages. It provides additional support for non-API documents written in files with .ngdoc extension; it also computes additional properties specific to Angular related code.

File Readers

Processors

Tag Definitions

This package modifies and adds new tag definitions on top of those provided by the jsdoc package: area, element, eventType, example, fullName, id, module, name, ngdoc, packageName, parent, priority, restrict, scope and title.

Inline Tag Definitions

Services

Templates

This package provides a set of templates for generating an HTML file for each document: api, directive, error, filter function, input, module, object, overview, provider, service, type and a number to support rendering of the runnable examples.

You should be aware that because of the overlap in syntax between Nunjucks bindings and AngularJS bindings, the ngdoc package changes the default Nunjucks binding tags:

templateEngine.config.tags = {
  variableStart: '{$',
  variableEnd: '$}'
};

Rendering Filters

Rendering Tags

examples Package

This package is a mix-in that provides functionality for working with examples in the docs.

Inside your docs you can markup inline-examples such as:

Some text before the example

<example name="example-name">
  <file name="index.html">
    <div>The main HTML for the example</div>
  </file>
  <file name="app.js">
    // Some JavaScript code to be included in the example
  </file>
</example>

Some text after the example

Processors

Deployment Configuration

The generateExamplesProcessor and generateProtractorTestsProcessor processors have a required property called deployments. This property should be an array of deployment information objects telling the processor what files to generate.

For instance you might have a "debug" deployment that loads angular.js into the example, and also a "default" deployment that loads angular.min.js into the example. Equally you might have deployments that use JQuery and some that only use Angular's jqLite.

You can configure this in your package like so:

.config(function(generateExamplesProcessor, generateProtractorTestsProcessor) {
  var deployments = [
    { name: 'debug', ... },
    { name: 'default', ... }
  ];

  generateExamplesProcessor.deployments = deployments;
  generateProtractorTestsProcessor.deployments = deployments;
});

A deployment can must have a name property and can also include an examples property that contains information about paths and extra files to inject into runtime examples. Further a protractor test is generated for each deployment and it uses the deployment name to find the path to the associated example for that deployment.

{
  name: 'default',
  examples: {
    commonFiles: {
      scripts: [ '../../../angular.js' ]
    },
    dependencyPath: '../../../'
  }
}

Here you can see we have a default deployment that injects the angular.js file into all examples, plus any dependencies referenced in the example itself are made relative to the given dependencyPath.

Inline Tag Definitions

Services

post-process-html Package

This package provides a HTML post process manager powered by rehype. It uses the rehype processing engine to manipulate the renderedContent HTML via rehype "plugins" that work with HTML ASTs (HASTs). Read more https://github.com/wooorm/rehype

Processors

typescript Package

File Readers

Processors

Services

Templates

This package does not provide any templates nor a templateEngine to render templates (use the nunjucks package to add this).

Tag Definitions

Please note that at the moment the @param documentation is ignored.