Get basic SSR example working

This commit is contained in:
Greg Johnston 2022-12-06 23:04:48 -05:00
parent dcbdbc8925
commit 963ff85a5f
5 changed files with 108 additions and 3 deletions

View file

@ -0,0 +1,22 @@
[package]
name = "hydration-test"
version = "0.1.0"
edition = "2021"
[lib]
crate-type = ["cdylib", "rlib"]
[dependencies]
leptos = { path = "../../../leptos", default-features = false }
actix-web = { version = "4", optional = true }
actix-files = { version = "0.6", optional = true }
wasm-bindgen = { version = "0.2", optional = true}
console_error_panic_hook = "0.1.7"
cfg-if = "1.0.0"
[features]
default = ["ssr"]
ssr = ["leptos/ssr", "dep:actix-files", "dep:actix-web"]
hydrate = ["leptos/hydrate", "dep:wasm-bindgen"]
[workspace]

View file

@ -0,0 +1,44 @@
use leptos::*;
#[component]
pub fn App(cx: Scope) -> View {
view! {
cx,
<>
"This is some text"
<ComponentA/>
</>
}
}
#[component]
pub fn ComponentA(cx: Scope) -> View {
let (value, set_value) = create_signal(cx, "".to_string());
div(cx)
.child(
input(cx)
.attr("type", "text")
.prop("value", (cx, value))
)
.child(
p(cx)
.child("Value is: ")
.child((cx, value))
.child("!")
)
.into_view(cx)
}
cfg_if::cfg_if! {
if #[cfg(feature = "hydrate")] {
use wasm_bindgen::prelude::wasm_bindgen;
#[wasm_bindgen]
pub fn hydrate() {
console_error_panic_hook::set_once();
leptos::hydrate(body().unwrap(), move |cx| {
view! { cx, <App/> }
});
}
}
}

View file

@ -0,0 +1,38 @@
use actix_web::{web, App, HttpResponse, HttpServer};
use actix_files::Files;
use leptos::*;
use hydration_test::*;
#[actix_web::main]
async fn main() -> std::io::Result<()> {
HttpServer::new(|| App::new()
.service(Files::new("/pkg", "./pkg"))
.route("/", web::get().to(
|| async {
HttpResponse::Ok()
.content_type("text/html")
.body({
let runtime = create_runtime();
let html = run_scope(runtime, move |cx| {
view! {
cx,
<App/>
}.render_to_string().to_string()
});
runtime.dispose();
format!(r#"<!DOCTYPE html>
<html>
<head>
<script type="module">import init, {{ hydrate }} from '/pkg/hydration_test.js'; init().then(hydrate);</script>
</head>
<body>{html}</body>
</html>
"#)
})
}
)
))
.bind(("127.0.0.1", 8080))?
.run()
.await
}

View file

@ -159,7 +159,8 @@ where
let mut repr = ComponentRepr::new(name);
leptos_reactive::on_cleanup(cx, move || disposer.dispose());
// TODO this was causing SSR to panic with a BorrowMut error
//leptos_reactive::on_cleanup(cx, move || disposer.dispose());
repr.children = vec![children];

View file

@ -59,7 +59,7 @@ pub trait IntoElement: IntoElementBounds {
/// A unique `id` that should be generated for each new instance of
/// this element, and be consitant for both SSR and CSR.
#[cfg(feature = "ssr")]
#[cfg(not(all(target_arch = "wasm32", feature = "web")))]
fn hydration_id(&self) -> usize;
}
@ -536,7 +536,7 @@ macro_rules! generate_html_tags {
#[cfg(all(target_arch = "wasm32", feature = "web"))]
#[educe(Deref)]
element: web_sys::HtmlElement,
#[cfg(feature = "ssr")]
#[cfg(not(all(target_arch = "wasm32", feature = "web")))]
id: usize,
}