dioxus icon indicating copy to clipboard operation
dioxus copied to clipboard

dioxus-cli, web example, no CSS

Open kuba23c opened this issue 1 year ago • 2 comments

Problem

I created example web app with dioxus-cli with vanilla css. I followed this doc: https://dioxuslabs.com/learn/0.5/getting_started Web app builds properly but there is no CSS on website.

Steps To Reproduce

Steps to reproduce the behavior:

  • cargo install dioxus-cli
  • dx new (Web, Vanilla css, Dioxus router, name: test)
  • cd test
  • dx serve

Expected behavior

CSS format website properly

Screenshots

image

Environment:

  • Dioxus version: v0.5.7
  • Rust version: stable-x86_64-pc-windows-msvc , rustc 1.82.0 (f6e511eec 2024-10-15)
  • OS info: windows
  • App platform: web

Questionnaire

kuba23c avatar Nov 29 '24 11:11 kuba23c

Oh!

I was just about to post an issue on this. Something seems to be broken with CSS + dioxus in general.

This problem also happens on fullstack, and isn't specific to the test application.

Changing the style field (e.g. style = ["/assets/main.css"] or style = ["./assets/main.css"]) in Dioxus.toml does not fix this either.

vjackson725 avatar Nov 29 '24 13:11 vjackson725

I have also met with this problem.

The main branch build of dioxus-cli seems to fix this:

  • run cargo install --git https://github.com/DioxusLabs/dioxus dioxus-cli
  • run again dx new -- creates another template with dioxus 0.6.0-alpha.5
  • edit style = ["assets/main.css"]

... but it only fixes this for web, not for desktop

johnny-smitherson avatar Dec 02 '24 10:12 johnny-smitherson

After release v0.6.1 web example and CSS works properly:

cargo binstall dioxus-cli --version 0.6.1 --force

kuba23c avatar Dec 19 '24 11:12 kuba23c

The assets in the template work on web and desktop. The template imports assets using the document::* element which work across all platforms.

edit `style = ["assets/main.css"]`
... but it only fixes this for web, not for desktop

The web.resource.style field in the Dioxus.toml is only used in the web build. The new document::Link element works across all platforms

ealmloff avatar Dec 19 '24 14:12 ealmloff