strothj / react-docgen-typescript-loader

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

TypeError: Cannot read property 'escapedText' of undefined #11

Closed vajkri closed 6 years ago

vajkri commented 6 years ago

Bug summary

I am trying to run Storybook 4.0.0-alpha.8 with Typescript and react-docgen-typescript-loader. Currently I am trying to make it work using ts-loader. Whenever I run yarn storybook, i get the error:

Module build failed: TypeError: Cannot read property 'escapedText' of undefined at 
/Users/.../node_modules/react-docgen-typescript/lib/parser.js:410:32

Steps to reproduce

.storybook/config.js

...
function loadStories() {
    const req = require.context('../src', true, /^.*\.stories\.tsx$/)
    req.keys().forEach(filename => req(filename))
}
...

.storybook/webpack.config.js

const path = require("path");
module.exports = (baseConfig, env, config) => {
    config.module.rules.push({
        test: /\.(ts|tsx)$/,
        use: [
            require.resolve("ts-loader"),
            require.resolve("react-docgen-typescript-loader")
        ]
    });
    config.resolve.extensions.push(".ts", ".tsx");
    return config;
};

Folder structure

├── .storybook
└── src
    └── components
        └── Button
            ├── Button.tsx
            └── Button.stories.tsx

Run yarn storybook

Storybook version and affected addons

"@storybook/addon-actions": "^3.4.6",
"@storybook/addon-info": "^3.4.6",
"@storybook/addon-links": "^3.4.6",
"@storybook/addons": "^3.4.6",
"@storybook/react": "4.0.0-alpha.8",
"react-docgen-typescript-loader": "^2.1.0",
"ts-loader": "^4.3.1",
"tslint": "^5.9.1",
"typescript": "^2.9.1",
"webpack": "^4.11.1",
"webpack-cli": "^2.1.3"

Screenshot: screen shot 2018-06-07 at 13 02 06

strothj commented 6 years ago

Thank you for the detailed bug report!

I'll take a look at this. Can you upload a sample of the component too? The Button.tsx.

One thing you can try is to exclude a particular component for debugging purposes.

Webpack loader options:

options: {
      excludes: ["stories\\.tsx$", "TextFieldTooltip"],
    },
vajkri commented 6 years ago

Thanks for your reply @strothj. I found out that the error was coming from my solution, not react-docgen-typescript-loader. I had a let initialized, which was apparently getting the wrong type this way. But the weird part is, I wasn't getting any errors in the actual project before I added react-docgen-typescript-loader. Anyway, it's fixed now :)