Integrate bevy in dioxus component page?

[ThomasCartier]

Hi,
Reading https://bevy-cheatbook.github.io/platforms/wasm/webpage.htm
We see that we can embed bevy in a page targeting a canvas.

rsx!(div {

       canvas{
         id:"bevy_canvas",
        BevyComponent{}
       }
    }
)

In BevyComponent I tried:

#[component]
fn BevyComponent(){
  let mut app = App::new();
  app.add_plugins((
          DefaultPlugins
          .set(AssetPlugin {
                  meta_check: AssetMetaCheck::Never,
                  ..default()
          })
          .set(WindowPlugin {
                  primary_window: Some(Window {
                          canvas: Some("bevy_canvas".into()),
                          ..Default::default()
                  }),
                  ..default()
          })
  ));
}

I saw the bevy_dioxus crate but the approach is differing here: I would liek to use a canvas in a component.
It's much simpler that way.

The error I get tells me than my canvas doesn't exists.

So, what's the best way to let Bevy see the canvas ?

Thanks guys,

[ThomasCartier]

I went the custom index.html route!