Bundling Preact with a library using Vite? Or another way? #3810
Unanswered
joeattardi
asked this question in
Q&A
Replies: 2 comments 13 replies
-
Seems like you're struggling more so with Vite's library building than anything else; conceptually, I don't see any issues with your plan. I can write up a demo w/ Not necessarily pushing Microbundle, just one I help maintain and am most familiar with. |
Beta Was this translation helpful? Give feedback.
10 replies
-
You know, i just took a look at your repo and I actually really like this approach and I think I may run with that. |
Beta Was this translation helpful? Give feedback.
3 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Hi, not sure if this is the best place to ask this question but hopefully someone has an idea for me :)
Here's what I'm trying to do: I have a React component. I want to allow non-React apps to use this component too without having to pull in all of React. I'm using Vite to build these libraries.
So my idea was basically to create another library that uses Preact and the compat layer to render the React component using Preact, and ship that library with the component and Preact bundled. The goal is that the consumer of the compatibility package doesn't even have to be aware that it's a React/Preact component.
This idea hasn't really worked, though. I tried two ways:
The compability package has the component package as a peer dependency. In this case the compat package builds fine, however when I import it into a fresh vanilla JS project, I get weird errors like
Uncaught TypeError: Cannot add property __, object is not extensible
and a bunch of minified stack trace entries. This seems to be fixed by adding the alias to preact from react in the vanilla package, but then it blows up because it can't find Preact. I would have thought the compatiblity layer bundled Preact and it would be able to find it from there but seems that isn't correct.The compatibility package includes the component package as a dependency, so it is bundled. When I do this, I can't build the compatibility package because it's not able to find preact (getting a
ENOENT: no such file or directory, open 'preact/compat'
), presumably it's trying to build the main package from the compatibility one. The alias for preact is working but it can't find preact (even though I have it as a dependency).Maybe there is a more straightforward way I am missing, or a better model for distributing such components.
Thank you!
Beta Was this translation helpful? Give feedback.
All reactions