search

leptos-rs / cargo-leptos

Build tool for Leptos (Rust)
MIT License
315 stars 88 forks source link

feat: add support for hot-reloading to patch DOM before recompiling #89

Closed gbj closed 1 year ago

gbj commented 1 year ago

So my intention here is to maintain a separate leptos_hot_reload package in the main repository that both does the diffing of view macros and handles the patching in the browser. I thought this would be useful because a) it reduces the maintenance burden on you and b) I actually realized I could share some code between the hot reloading and the view macro, so it made more sense for it to live over there at a point.

I decided to spin up a separate watch process for this, so that it kind of just operates independently of the existing compile/recompile process.

I'm fine with this being behind a feature flag like --experimental-hot-reload if you'd like. This may be good because in case of bugs, it's easier to fall back to the old behavior.

Take your time, of course. I've done some testing and it's probably at least alpha-worthy, but I'm sure it could use more eyes.

gbj commented 1 year ago

I'm using this with my own app this morning and noticing some additional work to be done, so taking it down to a draft for now!

gbj commented 1 year ago

Okay @akesson I think this is ready for review. It's not perfect, but let's not let the perfect get in the way of the good enough, I think...

I think it should be behind a --hot-reload flag for now so it can have a bit of a beta phase, but haven't spent the time to look at the best way to add this (I'm pretty unfamiliar with building CLI apps) so feel free to gate it yourself or point me in the right direction.

akesson commented 1 year ago

Sorry for taking this long to review this (I feel quite bad about it). At first, it seemed like a huge PR with 50 files changed and I thought I'd need at least half a day to review it, but now I realise that all that was just noise from commits made to the main branch.

I updated the cargo dependencies of examples/project, which is configured to use Tailwind, but I can't get it to work. The patch arrives in the browser (I see it in the console) but it is not applied until the full cargo rebuild has finished. Is there something else I need to do to make it work?

gbj commented 1 year ago

Oh sorry, unsurprisingly I probably messed something up when merging things in from main.

Couple things to check

  1. It only works for projects compiling with nightly Rust right now
  2. There should be something that looks like [HOT RELOADING] ... that logs in the console when you load the page. This is the JS that handles the patches on the client side.

If you use nightly and you see the [HOT RELOADING] but the patches isn't applied, then... sad, and I'll have to figure it out.

akesson commented 1 year ago

I merged your contribution to another branch and added the --hot-reload option and merged it as #107 which means that this PR was successfully added to cargo-leptos. Thanks for the contribution!