I may have a fix for "support for webpack v5"

[wh1t3h47]

I am opening this issue because the original one was flagged as spam and I coudn't comment on it
#1703

I was able to solve this problem as described:
1 - Eject your project;
2 - Fix webpack configuration to port to webpack v5; how to do it?

There is also a comment which says something like TODO remove in webpack 5, remove the line below;

3 - Search for formatWebpackMessages(webpackMessages) inside config/build.js;
4 - Replace with the following block of code:

        const webpackMessages = stats.toJson({
          all: false,
          warnings: true,
          errors: true,
        });
        webpackMessages.errors = webpackMessages.errors.map(
          /** @param {object|string} error either from webpack 4 or 5 */
          (error) => (typeof error === 'string')? error: (error.message || ''),
        );
        messages = formatWebpackMessages(webpackMessages);
      }

I hope this helps.

EDIT:
Since we have to support webpack v4 and v5, I made the above code detect if the error object is from webpack 4

[jasonwilliams]

@sapegin or @elevatebart why is #1703 locked? Can we re-open it? We need a space for webpack 5 issues to be raised

[elevatebart]

@jasonwilliams @rgbkrk unfortunately react-styleguidist is relying on a library that is part of create-react-app react-dev-utils. This library is not compatible with webpack 5 yet.

There is good news though: It will be getting updated soon as this PR has just been merged 11 days ago. When the lib is released I will update the dependency and release a version of rsg@11. Until then we can only hack a fix.

I have been (loosely) trying to do so but without success yet.

[juanca]

I was able to use the react-dev-utils pre-release in a fork for react-styleguidist. I don't know if people want to wait or perhaps react-styleguidist can also have a pre-release. I do have to fix a few things in my project using react-styleguidist but I don't think that's related to either styleguidist or react-dev-utils

https://github.com/juanca/react-styleguidist/tree/master

P.S. I would have made a PR but I don't seem to have a compatible version of NPM and I had to commit the artifacts.

[juanca]

It is almost 100% compatible as far as I can tell. There is some fixing needed in the web socket integration -- we seem to be trying to ship the process key to the frontend but it really needs to be replaced with some DefinePlugin.

It is on line 63 of the attached screenshot.

[github-actions]

🎉 This issue has been resolved in version 11.2.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀