CRA's webpack configuration is mangling function names (and removing prop types) in static build

[jansav]

Describe the bug
When webpack configuration is used directly when CRA, it causes build-storybook to mangle function names. This causes issues that code source and prop types are not presented correctly.

As #3879 says, it could be solved by adding .displayName to each component, but since CRA is now removing prop types in production builds (facebook/create-react-app#3818), prop types are not visible in static version of storybook.

To Reproduce
Steps to reproduce the behavior:

1. Create app using Create React App
2. Install storybook
3. Create functional component and stories for it
4. Runnpm run build-storybook (without having custom webpack configuration)
5. Serve static storybook and see results.

Expected behavior
Function name is used as display name. Prop types are visible in page.

System:

• Framework: React, react-scripts (2.1.1)
• Addons: Info, knobs, options
• Version: 4.0.2

Additional context
It might be that this is something that storybook can't really do anything else than suggest not using CRA's webpack configuration directly. However I would like to see if there is any suggestions how to solve this issue without using full control mode.

[jansav]

Any tips?

[davidchristie]

I recently hit this issue when upgrading @types/react to version 16.7.6.

Dropping back to 16.4.18 fixed it for me: davidchristie/social-network@9d6f004