Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Panic when tailwind generates somewhat invalid css #3372

Closed
istudyatuni opened this issue Dec 17, 2024 · 1 comment · Fixed by #3509
Closed

Panic when tailwind generates somewhat invalid css #3372

istudyatuni opened this issue Dec 17, 2024 · 1 comment · Fixed by #3509
Assignees
Labels
bug Something isn't working manganis Related to the manganis crate

Comments

@istudyatuni
Copy link

Problem

When using tailwind with daisyui plugin, tailwind generates css with constructs like

*tr:hover {}

this is a * property hack, but lightningcss emits error in this case, and dioxus always call unwrap() on parsing errors

let mut stylesheet = StyleSheet::parse(css, ParserOptions::default()).unwrap();

Steps To Reproduce

Steps to reproduce the behavior:

dx init # select barebones, fullstack=false, router=false, tailwind=true, platform=desktop
bun add -d tailwindcss
bunx tailwindcss -i input.css -o assets/tailwind.css --watch # in separate terminal
dx serve # ok

bun add -d daisyui

add plugin to tailwind.config.js:

+import daisyui from "daisyui"
 module.exports = {
   //...
   plugins: [
+    daisyui,
   ],
 }

include tailwind.css itself:

 import daisyui from 'daisyui'
 
 /** @type {import('tailwindcss').Config} */
 module.exports = {
   mode: "all",
-  content: ["./src/**/*.{rs,html,css}", "./dist/**/*.html"],
+  content: ["./src/**/*.{rs,html,css}", "./assets/**/*.css"],
   theme: {
     extend: {},
   },
   plugins: [daisyui],
 };
dx serve # panic
thread '<unnamed>' panicked at /build/dioxus-cli-0.6.0-vendor.tar.gz/dioxus-cli-opt/src/css.rs:37:75:
11:10:54 [dev] Build failed: Other(Failed to write assets

Caused by:
    A task failed while trying to copy assets: task 21 panicked with message "called `Result::unwrap()` on an `Err` value: Error { kind: UnexpectedToken(Ident(\"tr\")), loc: Some(ErrorLocation { filename: \"\", line: 3061, column: 24 }) }")

Initially I include tailwind.css by mistake, but I think it shouldn't panic

Expected behavior

No panic, app works

Screenshots

-

Environment:

  • Dioxus version: 0.6.0
  • Rust version: 1.83.0
  • OS info: NixOS on nixos-unstable
  • App platform: desktop (I guess any)

Questionnaire

I would like to fix and I have a solution, but maybe a bit later

In parcel-bundler/lightningcss#765 suggested to enable error_recovery option


Similar issue: #3310

@ealmloff ealmloff self-assigned this Jan 7, 2025
@ealmloff ealmloff added bug Something isn't working manganis Related to the manganis crate labels Jan 7, 2025
@ealmloff
Copy link
Member

ealmloff commented Jan 7, 2025

#3509 adds the error recovery option, but since the CSS that tailwind generates is invalid it gets removed. The CLI no longer panics, so this is somewhat improved, but you may need to disable minification if the invalid styles for old versions of IE are important in your project

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working manganis Related to the manganis crate
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants