Add ssr feature note to the book

I wasn't aware of Leptos' SSR build process, and enabled the
`leptos-use` feature globally. Because of this I ended up with the
server version of the functions in the client, which obviously did not
work.
This commit is contained in:
Luper Rouch 2024-02-23 10:19:21 +01:00
parent 446b10b1cf
commit 9a46f9dca9

View file

@ -30,6 +30,25 @@ find information about these differences in their respective docs under the sect
If you don't find that section, it means that the function works exactly the same on both, the client
and the server.
> **Note:** do not enable `leptos-use`'s `ssr` feature directly!
>
> ```toml
> [dependencies]
> leptos-use = { version = "0.10", features = ["ssr"] } # do not do this
> ```
The `ssr` feature is used to select which version of the functions are built.
Effectively it means your application is built two times: with `ssr` enabled to
build the server executable, and with `ssr` disabled to build the client's WASM
binary module.
So if you enable `leptos-use`'s `ssr` feature globally, you will get the server
version of the functions in the client.
By adding `"leptos-use/ssr"` to the `ssr` feature of your project, it will only
be enabled when your project is built with `ssr`, and you will get the server
functions server-side, and the client functions client-side.
## Functions with Target Elements
A lot of functions like `use_resize_observer` and `use_element_size` are only useful when a target HTML/SVG element is
@ -52,3 +71,4 @@ use_event_listener(use_window(), keyup, |evt| {
There are some convenience methods provided as well, like `use_document().body()` which
just propagate a `None` on the server.