{"id":20496,"library":"react-docgen-annotation-resolver","title":"React Docgen Annotation Resolver","description":"A resolver for react-docgen that enables parsing of exports annotated with @component JSDoc tag as React components. Version 2.0.0 is stable; the package is released on npm as needed. Unlike default react-docgen resolvers that infer components from patterns like displayName or propTypes, this resolver explicitly marks any export with a @component annotation as a component, giving developers control over what gets documented.","status":"active","version":"2.0.0","language":"javascript","source_language":"en","source_url":"ssh://git@github.com/Jmeyering/react-docgen-annotation-resolver","tags":["javascript"],"install":[{"cmd":"npm install react-docgen-annotation-resolver","lang":"bash","label":"npm"},{"cmd":"yarn add react-docgen-annotation-resolver","lang":"bash","label":"yarn"},{"cmd":"pnpm add react-docgen-annotation-resolver","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"ESM-only since v1.0.0; CJS require works only if the package is transpiled, but it's not recommended.","wrong":"const annotationResolver = require('react-docgen-annotation-resolver');","symbol":"annotationResolver","correct":"import annotationResolver from 'react-docgen-annotation-resolver';"},{"note":"This package exports a single default function; named destructuring will result in undefined.","wrong":"import { annotationResolver } from 'react-docgen-annotation-resolver';","symbol":"default","correct":"import annotationResolver from 'react-docgen-annotation-resolver';"},{"note":"The package does not export TypeScript types. Use @types/react-docgen or declare your own.","wrong":"import { Resolver } from 'react-docgen-annotation-resolver';","symbol":"TypeScript types","correct":"import annotationResolver from 'react-docgen-annotation-resolver';"}],"quickstart":{"code":"import annotationResolver from 'react-docgen-annotation-resolver';\nimport reactDocgen from 'react-docgen';\n\nconst sourceCode = `\n/** @component */\nexport default function MyButton() { return <button />; }\n`;\n\nconst doc = reactDocgen.parse(sourceCode, undefined, annotationResolver);\nconsole.log(doc); // [{ description: '', ... }]","lang":"typescript","description":"Shows how to use the annotation resolver with react-docgen's parse function to extract documentation from a component annotated with @component."},"warnings":[{"fix":"Upgrade to Node >=10 or pin to v1.x if needed.","message":"v2.0.0 drops support for Node < 10 (was <8 in v1). May break CI pipelines using older Node.","severity":"breaking","affected_versions":"<2.0.0"},{"fix":"This is the intended alternative; no fix required.","message":"The default resolver from react-docgen is deprecated in favor of custom resolvers like this one.","severity":"deprecated","affected_versions":">=1.0.0"},{"fix":"Ensure your component is a default export with a JSDoc block containing @component.","message":"The resolver only detects @component annotation on default exports; named exports are ignored.","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Only annotate actual React components with @component.","message":"If the annotated export is not a React component (e.g., a plain object), react-docgen may still parse it but produce incomplete documentation.","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Use import annotationResolver from 'react-docgen-annotation-resolver';","cause":"Importing as a named export instead of default import.","error":"TypeError: annotationResolver is not a function"},{"fix":"Ensure you import and pass the default function: reactDocgen.parse(source, undefined, annotationResolver);","cause":"Passing undefined or a non-function value as resolver to react-docgen.parse.","error":"Error: You provided an invalid resolver. Resolvers must be functions."},{"fix":"Run npm install react-docgen-annotation-resolver --save-dev","cause":"Package not installed or incorrect import path.","error":"Module not found: Can't resolve 'react-docgen-annotation-resolver'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}