strothj / react-docgen-typescript-loader

Webpack loader to generate docgen information from Typescript React components.
Other
360 stars 47 forks source link

Inline subtype shape inferred as "signature" #95

Open dontsave opened 4 years ago

dontsave commented 4 years ago

hi, running into a small bug with sub types being inferred inline:

type SubType = {
  name: string;
};
type Props = {
  children?: ReactNode;
  /** testing */
  name: string;
  sub?: SubType;
};

function Component({ name = `` }: Props) {
  return <>hey</>;
}

is inferred as:

image

however exporting SubType from a separate file and importing it works correctly. This is only an issue with type aliases not interfaces.

bartekczyz commented 4 years ago

Same issue here, with following config:

module.exports = {
    // ...
    webpackFinal: config => {
        config.module.rules.push({
            test: /\.tsx?$/,
            include: path.resolve(__dirname, '../src'),
            use: {
                loader: require.resolve('react-docgen-typescript-loader'),
                options: {
                    tsconfigPath: path.resolve(__dirname, '../tsconfig.json'),
                    shouldExtractLiteralValuesFromEnum: true,
                },
            },
        })

        config.resolve.extensions.push('.ts', '.tsx')

        return config
    },
}

@strothj I've followed the docs, but each time I use an union type or inline fn declaration I get union or signature as a type, no matter if types are in the same file or not. Here's minimum repro component

import * as React from 'react'

type Compound = 'a' | 'b' | 'c'

type Props = {
    first: Compound
    second: string
    third?: (x: Compound) => Compound
}

export const ReproComponent = ({ first, second, third }: Props) => (
    <div>
        {first}
        {second}
    </div>
)

and as a result I see

name description default
first* union -
second* string -
third signature -