-
Notifications
You must be signed in to change notification settings - Fork 1.1k
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
Esbuild best practice for bundling React apps with deps triggering multiple React instances?? #3419
Comments
It's worth noting how multiple users of Webpack resolved this multiple-instance vs single-instance of React problem:
Which apparently causes React to only be output a single time in the bundle, rather than being output twice or more with multiple paths like |
It's not always the bad case when you have multiple instances of React (which is rarely seen but the use case still exists). Since you mentioned the |
@hyrious Thank you, thank you, thank you for taking a minute to point out that option! That seems to be a great way to get past the multiple instances issue. ❤️ |
The issue thread you are linking to is completely irrelevant to your problem. It does not mean what you think it means. That issue is talking about esbuild generating multiple external imports for the same package in the same file, which always results in the JavaScript VM importing a single package. It's impossible for two The fundamental problem here is that you have multiple copies of the You can try to hack away the problem using some kind of package alias but that could potentially result in broken code because you are forcing a version of In any case, this problem is not esbuild's job to fix. The job of a bundling operation is to bundle the files on the file system as they are while respecting their real behavior. Since there are multiple copies of |
I'm closing this issue because esbuild is working as intended here. |
I am using esbuild 0.19.3
What is happening:
In a simple React project that imports a library, which imports React:
React is getting imported twice as per this --analyze=verbose output
Modern React with hooks simply cannot work correctly when multiple instances are created
link explaining WHY you can't have multiple instances of React in an App
I simply want to ask what is the recommended way to resolve this with
esbuild
?? (which I think is the bees-knees).I made some progress using
--external:react --external:react-dom
, as it's clear React and React-dom don't even get bundled in this case. I got stuck withUncaught Error: Dynamic require of "react-dom/client" is not supported
error in the browser, but I think I might be over looking a flag to use Esm6 imports.But before proceeding down that road, I want to make sure from your perspective, @evanw
that this is the best way to go. (using external rather than bundling React with some sort of de-duplication)
What do you recommend as a method and mechanism to stop multiple-imports of React into applications which import libraries that import React (yet as PeerDependencies) so that esbuild can be used in this situation for bundling React apps that import libs that import React?
My sample project:
cameronelliott/whip-whep-webrtc-react@b872e15
PS
I also noticed others in issue #475 struggling with multiple instances of React:
#475 (comment)
#475 (comment)
#475 (comment)
#475 (comment)
#475 (comment)
#475 (comment)
#475 (comment)
#475 (comment)
#475 (comment)
PPS
You made a comment about how duplicate instances should not impact correctness,
but it absolutely does in the case of React!
#475 (comment)
The text was updated successfully, but these errors were encountered: