honojs / honox

HonoX - Hono based meta framework
https://hono.dev
MIT License
1.63k stars 42 forks source link

Deployment instructions to local server missing, either with node and bun #42

Open Angelelz opened 8 months ago

Angelelz commented 8 months ago

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.

laiso commented 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

Angelelz commented 7 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 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.

yusukebe commented 7 months ago

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.

laiso commented 7 months ago

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

andresgutgon commented 7 months ago

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?

laiso commented 7 months ago

@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.

andresgutgon commented 7 months ago

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

laiso commented 7 months ago

thanks, I understand your problem, but I haven't figured out how to fix it yet.

andresgutgon commented 7 months ago

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

laiso commented 7 months ago

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...

umstek commented 6 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

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

emilienbidet commented 2 months ago

It would be amazing to add a @hono/vite-build-bun plugin package