How to use vue-docgen-api - 10 common examples

To help you get started, we’ve selected a few vue-docgen-api examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github rei / rei-cedar / build / component-docs-build.js View on Github external
function docsBuild(file, info) {
  console.log(`Processing file: ${file}\n`)
  const vueObj = vueDocgen.parse(file)

  let compDataObj = {
    "readme": '',
    "examples": '',
    "tmplTblData": '',
    "version": '',
  }

  // calculate associated component names and paths
  const vueCompName = path.basename(file,'.vue')
  const vueCompDir = path.dirname(file)
  const vueCompFilePath = vueCompDir + path.sep + vueCompName
  const BASE_VERSION = '0.0.0'
  let latestMdDoc = null, latestMdVer = BASE_VERSION

  // Determine version of current raw vue component based on its associated package.json file
github rei / rei-cedar / build / vue-docs.js View on Github external
files.forEach((file) => {
    console.log(`Processing file: ${file}\n`)
    const vueObj = vueDocgen.parse(file)
    
    // Determine version of current raw vue component
    const currentVer = `${vueObj["tags"] && vueObj["tags"]["version"] ? vueObj["tags"]["version"][0]["description"] : ''}`

    if (!semver.valid(currentVer)) 
      throw new Error(`Vue component at ${file} doesn't have a valid semver @version tag`)

    const mdTemplate = createMarkdownTemplate(file, vueObj)

    const vueCompName = path.basename(file,'.vue')
    const vueCompDir = path.dirname(file)

    let latestMdDoc = null, latestMdVer = '0.0.0'
    
    // pull in the markdown documentation files and their NPM versions
    glob(`${vueCompDir}/${vueCompName}*.md`, (mdFileErr, mdFiles) => {
github ph1p / vuepress-jsdoc / helpers / vue-docgen-to-markdown.js View on Github external
module.exports = async path => {
  const file = fileContent();

  try {
    const data = await vueDocs.parse(path);

    file.addline(`# ${data.displayName}\n${data.description}\n`);

    // Tags
    file.addline(generateTags(data));

    file.addline('## Table of contents\n[[toc]]\n');

    // Props
    if (data.props) {
      const props = data.props;
      let propsContent = '## Props\n\n';

      props.forEach(prop => {
        propsContent += `### ${prop.name} (\`${prop.type.name}\`)\n`;
github vue-styleguidist / vue-styleguidist / loaders / vuedoc-loader.js View on Github external
	const defaultParser = file => vueDocs.parse(file, { alias, modules });
	const propsParser = config.propsParser || defaultParser;
github vue-styleguidist / vue-styleguidist / packages / vue-styleguidist / src / loaders / vuedoc-loader.ts View on Github external
const defaultParser = async (file: string) =>
		await parse(file, {
			alias,
			modules,
			jsx: config.jsxInComponents,
			validExtends: config.validExtends
		})
	const propsParser = config.propsParser || defaultParser
github DivanteLtd / storefront-ui / packages / vue / scripts / create-vue-components-docs.js View on Github external
function getComponentInfoFromVue(pathVueFile) {
  const fullPathVueFile = pathInsideComponentsRoot(pathVueFile);
  const componentDoc = vueDocs.parse(fullPathVueFile);

  const props = extractPropsFromComponentDoc(componentDoc);
  const slots = extractSlotsFromComponentDoc(componentDoc);
  const events = extractEventsFromComponentDoc(componentDoc);
  return {
    props: generateComponentDetailsInfo(props),
    slots: generateComponentDetailsInfo(slots),
    events: generateComponentDetailsInfo(events)
  };
}
github SoftwareBrothers / better-docs / component.js View on Github external
var parseVue = function (filePath, doclet) {
  const docGen = vueDocs.parse(filePath)
  doclet.name = doclet.longname = docGen.displayName
  return {
    displayName: docGen.displayName,
    filePath: filePath,
    props: Object.values(docGen.props || {}).map(prop => ({
      name: prop.name,
      description: prop.description,
      type: prop.type.name,
      required: typeof prop.required === 'boolean' && prop.required,
      defaultValue: prop.defaultValue
        ? (prop.defaultValue.func ? 'function()' : prop.defaultValue.value)
        : undefined
    })),
    slots: Object.keys(docGen.slots || {}).map(key => ({
      name: key,
      description: docGen.slots[key].description,
github sagalbot / vue-select / docs / .vuepress / generateApiDocs / node / generator.js View on Github external
module.exports = async (documentationRootDir) => {

  const file = path.resolve(
    documentationRootDir,
    '../src/components/Select.vue',
  );

  const documentation = await docs.parse(file, {
    jsx: false,
    addScriptHandlers: [
      /**
       * @param {Documentation} docs
       * @param {NodePath} path
       * @param {bt.File} astPath
       * @param {ParseOptions} options
       * @return {Promise}
       */
      function (docs, path, astPath, options) {

      },
    ],
    addTemplateHandlers: [
      /**
       * @param {Documentation} docs
github Radiergummi / phoenix / lib / parser / VueComponentParser.js View on Github external
static _parseSource ( source ) {
    return vueDocs.parseSource( source.code, source.name );
  }
github visualjerk / vue-cion-design-system / src / loader / jsdoc-loader.js View on Github external
module.exports = function(source) {
  const callback = this.async()
  const content = JSON.stringify(source)
    .replace(/\u2028/g, '\\u2028')
    .replace(/\u2029/g, '\\u2029')
    .replace(/\\n/g, '\n')
  const component = parseSource(content, this.resourcePath)
  callback(null, `module.exports = ${JSON.stringify(component)}`)
}

vue-docgen-api

Toolbox to extract information from Vue component files for documentation generation purposes.

MIT
Latest version published 7 days ago

Package Health Score

98 / 100
Full package analysis

Popular vue-docgen-api functions