Yew Stylist error: the trait bound Classes: From<StyleSource> is not satisfied

120 Views Asked by At

I'm currently working on a Yew project and attempting to utilize the stylist crate for styling components. The primary focus is on using the styled_component macro as demonstrated in the Yew documentation. However, I've encountered a specific error that I'm struggling to resolve.

The goal is to style a Yew component using the following code snippet:

use yew::prelude::*;
use stylist::yew::styled_component;
use stylist::{css};

#[styled_component]
pub fn App() -> Html {
    let sty = css!("color: red;");
    html! {<div class={sty.clone()}>{"Hello World!"}</div>}
}

Upon attempting to compile the code, I receive the following error:

error[E0277]: the trait bound `Classes: From<StyleSource>` is not satisfied
 --> src/lib.rs:8:24
  | 8 |     html! {<div class={sty.clone()}>{"Hello World!"}</div>}
  |                       ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  |                       |
  |                       the trait `From<StyleSource>` is not implemented for `Classes`
  |                       required by a bound introduced by this call
  |
  = help: the following other types implement trait `From<T>`:
            <Classes as From<Cow<'static, str>>>
            <Classes as From<implicit_clone::unsync::string::IString>>
            <Classes as From<Vec<T>>>
            <Classes as From<String>>
            <Classes as From<Option<T>>>
            <Classes as From<[T; SIZE]>>
            <Classes as From<&String>>
            <Classes as From<&implicit_clone::unsync::string::IString>>
          and 3 others
  = note: required for `StyleSource` to implement `Into<Classes>`

For more information about this error, try `rustc --explain E0277`.
error: could not compile `new_prac_web` (lib) due to 1 previous error

My Cargo.toml file looks like this:

[package]
name = "new_prac_web"
version = "0.1.0"
edition = "2021"

[dependencies]
stylist = { version = "0.13.0", features = ["parser", "yew"] }
yew = { git = "https://github.com/yewstack/yew/", features = ["csr"] }

Despite following the Yew and stylist documentation, the code didn't compile successfully. I expected success, considering the documentation and examples demonstrated a similar usage of the styled_component macro. Could someone please help me understand what's causing it and how I can resolve it? Any insights or suggestions would be greatly appreciated.

0

There are 0 best solutions below