live reload doesn't work when just modifying the css file

[jiker-burce]

Problem

It just notices me the following messages when I am modifying the css file of style { include_str!("../../statics/client_style.css") }:

Connected to hot reloading 🚀
Rebuild needed... shutting down hot reloading.
Manually rebuild the application to view further changes.

Steps To Reproduce

Steps to reproduce the behavior:

• add the code in main:

/bin/client.rs: 
hot_reload_init!(dioxus_hot_reload::Config::new().with_paths(&["statics"]));
    dioxus_desktop::launch_cfg(
        client_lib::Client,
        Config::default().with_window(WindowBuilder::new().with_resizable(false).with_inner_size(
            dioxus_desktop::wry::application::dpi::LogicalSize::new(440.0, 450.0),
        ).with_title(win_title)),
    );

Client.rs
    render!(div {
        link { href:"https://fonts.googleapis.com/icon?family=Material+Icons", rel:"stylesheet" }
        style { include_str!("../../statics/client_style.css") }
        main {

• cargo run --bin client
• modify the file ../../statics/client_style.css

Expected behavior

• the style can be changed after modified the css file without rebuild or reopen the app.

Environment:

• Dioxus version: 0.4.0
• Rust version: 1.75.0
• OS info: MacOS
• App platform: desktop

Questionnaire

• [ ] I'm interested in fixing this myself but don't know where to start
• [ ] I would like to fix and I have a solution
• [ ] I don't have time to fix this right now, but maybe later

[ealmloff]

include_str is a macro that copies the contents of the file to a string literal. The git version of Dioxus has limited for hot reloading assets that are read at runtime, but it cannot hot reload arbitrary macros. That would likely need deeper integration with cargo itself. To hot reloading the arbitrary code that macros expand to, you would need to recompile and patch part of your running code which is much more complicated than what dioxus currently supports

If you change your code to link to the stylesheet instead of embed the stylesheet within the code, it may hot reload in the latest git version of dioxus and the dioxus CLI

[jiker-burce]

@ealmloff I updated the version to 0.5.1 and use the link style, but it could not hot reload, too.

    rsx! {
        div {
            link { href:"https://fonts.googleapis.com/icon?family=Material+Icons", rel:"stylesheet" },
            link { href:"../../statics/client_style.css", rel:"stylesheet"},

the command line showed like this:

Rebuild needed... shutting down hot reloading.
Manually rebuild the application to view further changes.

[Initsnow]

I simply added style = ["./assets/style.css"] to Dioxus.toml and then used dx serve and it worked, but it didn't live reload until I deleted the dist folder to generate a new one. Can someone help me know the correct way to import css files?

[Initsnow]

Oh, I finally figured out how to load it. Just use link tag, but what's the use of the style key in Dioxus.toml?

[ealmloff]

The style key only works for the web/fullstack platforms. It should insert the link for you