Open Angelelz opened 8 months ago
I think it would be better to do this in Vite-build layer. For reference, I wrote a simple Vite plugin, so could someone please try it?
https://gist.github.com/laiso/caa8f8ea18451763b70c9c8af9815230
I think it would be better to do this in Vite-build layer. For reference, I wrote a simple Vite plugin, so could someone please try it?
https://gist.github.com/laiso/caa8f8ea18451763b70c9c8af9815230
I had abandoned the idea of using honox because I'm not well versed in vite plugin development and didn't have the time to investigate and make it myself. I just tried the plugin in your gist and it work flawlessly! It would be great if this could be included in the honox codebase but this workaround is doing wonders! You sir are a absolute magician! Thank you.
Thanks @laiso
It would be great if this could be included in the honox codebase but this workaround is doing wonders!
We could create a package like @hono/vite-build-node
, but the gist code would have to be more customized.
We could create a package like @hono/vite-build-node, but the gist code would have to be more customized.
If there are users who need it, I will open a pull request. Thanks
Hi @laiso awesome resource your vite node config. I almost has it running but the assets are not working. You can see the repo here: https://github.com/latitude-dev/static-embedding-examples/commit/86d0e29bc91617e17811442b813907e852067609#diff-abafdaf60d09c6581d544ea9cf2e0e1581bae831d56de39071d4d60fd908f217R22
Any idea of what could be wrong?
@andresgutgon Your project's assets are located under static/assets/, so you'll need to reference them accordingly.
- worker.use('/static/*', serveStatic({ root: './dist' }))
+ worker.use('/static/*', serveStatic({ root: './dist/static' }))
However, we must consider how to enable setting the default configuration in our vite-plugin.
No but I have JS and CSS in 2 different places
dist/static/styles.css
dist/assets/*.js // compiled islands and runtime
With
worker.use('/static/*', serveStatic({ root: './dist' }))
CSS is loading fine but the *.js
files are not being loaded
thanks, I understand your problem, but I haven't figured out how to fix it yet.
Solved. To make your Vite plugin work I put everything into static
folder. By default Rollup put chunk files into assets and statci files into static like the CSS. But Rollup has options to build everything into the same folder:
https://github.com/latitude-dev/static-embedding-examples/blob/main/nodejs/vite.config.ts#L18-L20
So now I can build a Honox and deploy it to fly.io 🎉
Honesty this was harder than expected. But I have to say honox is very nice
Solved. To make your Vite plugin work I put everything into static folder. By default Rollup put chunk files into assets and statci files into static like the CSS. But Rollup has options to build everything into the same folder:
Good 👍 I also tried building it, and it works as expected.
However, ideally, it would be linked to a CSS with a hash like this comment style.css?url
for deployments...
I think it would be better to do this in Vite-build layer. For reference, I wrote a simple Vite plugin, so could someone please try it?
https://gist.github.com/laiso/caa8f8ea18451763b70c9c8af9815230
Above might work with Bun as well but I modified it a little to support Bun, React, and TailwindCSS. Didn't test thoroughly.
https://gist.github.com/umstek/e87b1c2c2e0521fd44c7629e0c889301
It would be amazing to add a @hono/vite-build-bun
plugin package
It looks like for now honox only supports building for cloudflare. I looked into the codebase and couldn't find a vite plugin to build for node or bun. Or at least instructions.