The sveltedoc parser

Generate a JSON documentation for a Svelte file

Changelog

[4.0.0] 25.01.2021

• 🛠 [Fixed] Fix Issue #42
• 🛠 [Fixed] Partially fixed Issue #1. Now event name correcly parsed if it provided by top-level constant of the same file. Thanks for @soft-decay
• ✔ [Added] Support to complete parsing of component method arguments Issue #39. Thanks for @soft-decay
• ✔ [Added] Support to parse return types and description for methods in component Issue #37. Thanks for @soft-decay
• ✔ [Added] Options validation, thanks for @soft-decay
• 🔥 [Breaking] API rework for component methods description:
  • args property was renamed to params;
  • Change the structure of return item for methods:
    • desc property was renamed to description;
    • type property now contains the JSDocType object, instead of string type with text representation of type. This can be gets from text property of JSDocType object;
  • [Svelte2]: method arguments was presented with plain array with names, now that replaced with objects of SvelteMethodParamItem type;
• 🔥 [Breaking] Cleanup depricated code:
  • loc property was removed, please use locations instead, if you late with upgrade;
  • value property of SvelteComponentItem was removed, please use importPath instead

Full changelog of release versions can be found here

Install

npm install --save sveltedoc-parser

Features

• JSDoc support
  • Support description extraction for everything items
  • Support visibility scope from JSDoc keywords: @public, @protected, @private
• Extract global component description and keywords from JSDoc comment (Svelte 3)
  • Top level comment must include @component. Example script, Example html
• Extract list of imported components
  • Extract relative path to imported component (supports full-syntax and short-syntax import styles)
• Extract data properties
  • Extract description from JSDoc comment
  • Extract JS type from JSDoc (@type {string}) or parse default value if is not provided
• Extract computed properties with list of dependencies
• Extract list of references that attached to components or HTML elements
• Extract information about events
  • Events that propagated from child component or HTML elements <button on:click>...</button>
  • Parse event modifiers ... on:click|once
• Extract all fired events (Svelte 2 only)
  • Events that fired by this component by fire(...) method
  • Custom event handlers with private visibility scope
• Extract all dispatched events (Svelte 3)
  • Events that dispatched from script block by user-created dispatcher
  • Events that dispatched from markup expressions by user-created dispatcher
• Extract list of used default and named slots
• Extract component methods
  • Extract description from JSDoc comment
  • Extract parameters description from JSDoc comment
  • Extract JS type from JSDoc for parameters (@param {string} parameter)
  • Identify optional parameters (@param [parameter]), Google Closure Compiler syntax supported as well (@param {string=} parameter)
  • Identify default values for optional parameters (@param [parameter=Default value])
• Extract component helpers (Svelte 2 only)
• Extract component actions (Svelte 2 only)
• Extract component transitions (Svelte 2 only)
• Extract source locations for component symbols
  • data
  • slots
  • methods
  • refs
  • events

Configuration

Supported feature names

• 'name' - Extract the component name (Supported by Svelte 2 and Svelte 3).
• 'data' - Extract and parse the list of component data properties (Supported by Svelte 2 and Svelte 3).
• 'computed' - Extract and parse the list of component computed properties (Supported by Svelte 2 and Svelte 3).
• 'methods' - Extract the list of component methods (Supported by Svelte 2 and Svelte 3).
• 'actions' - Extract the list of component actions (Supported by Svelte 2).
• 'helpers' - Extract the list of component helpers (Supported by Svelte 2).
• 'components' - Extract the list of imported components (Supported by Svelte 2 and Svelte 3).
• 'description' - Extract the component description (Supported by Svelte 2 and Svelte 3).
• 'keywords' - Extract the component keywords (Supported by Svelte 2 and Svelte 3).
• 'events' - Extract the list of events that fired by this component (Supported by Svelte 2 and Svelte 3).
• 'slots' - Extract the list of slots provided by this component (Supported by Svelte 2 and Svelte 3).
• 'transitions' - Extract the list of transitions used by this component (Supported by Svelte 2).
• 'refs' - Extract the list of references used by this component (Supported by Svelte 2 and Svelte 3).

Output format

Output format are described at this document.

Please follow to Examples folder to check how Svelte components transforms to JSON document.

See example of output for Svelte 2 component here presented in JSON format for this component.

Usage

const sveltedoc = require('sveltedoc-parser');
const options = {
    filename: 'main.svelte'
};

sveltedoc.parse(options)
    .then(componentDoc => {
        console.log(componentDoc);
    })
    .catch(e => {
        console.error(e);
    });

API

parse(options)

Method to parse svelte component and provide doc object structure with details information.

detectVersion(options)

Method to detect svelte syntax version

• Returns 3 when Svelte 3 special syntax feature are used
• Returns 2 when Svelte 2 special syntax feature are used
• Returns defaultVersion or undefined when specific version can't be identified

Issues

All list of known issues presented at this page.

Found a new issues? Please contribute and write detailed description here.

Contributors

Author Alexey Mulyukin

Based on vuedoc-parse

License

MIT