-
Notifications
You must be signed in to change notification settings - Fork 924
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Missing error overlay #5452
Labels
Comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
When an error occurs during development, Webpack should show an error overlay, similar to Create React App:
There is an important destination between build (compile) errors, and runtime errors.
Related issues:
Build errors:
Build errors should show just fine, with the built in overlay:
However, Webpack doesn't read the source files directly. Instead, it is reading the dists, which bit will not output when there is a compilation error. It will show these in the terminal:
So, we need:
It should be something like this:
Runtime errors:
The default WDS error overlay does NOT handle runtime errors!
Confirmed here - webpack/webpack-dev-server#4308
What's more, since CRA v2 and support for Webpack 5, they seem to rely on this builtin overlay.
We should follow CRA's response to it here - facebook/create-react-app#12014
Possible solutions:
react-refresh-webpack-plugin
's overlayreact-refresh-webpack-plugin comes with its own overlay, though it doesn't come with the source file, and objectively looks less good.
turning it on is as simple as:
The previously official
react-error-overlay
package displayed errors just fine.This is what we have used, and it's currently not working anymore. (needs investigation)
Using WDS built-in overlay
The built in overlay does not handle runtime errors, though very easy to use:
Steps to Reproduce
Create any sort of an error, for example:
Build time error are a little more tricky with Bit.
Because of bit compilation, it won't make it to the dists.
We'd have to edit it manually:
The text was updated successfully, but these errors were encountered: