leptos-rs / cargo-leptos

Build tool for Leptos (Rust)
MIT License
344 stars 101 forks source link

use daisyui in leptos report Unexpected token Ident("tr") #317

Closed jiemo2187 closed 1 month ago

jiemo2187 commented 1 month ago

Describe the bug

    Finished `dev` profile [unoptimized + debuginfo] target(s) in 0.79s
       Cargo finished cargo build --package=frontend --lib --target-dir=xxx\target\front --target=wasm32-unknown-unknown --no-default-features
       Front compiling WASM
    Tailwind finished tailwind --input style/tailwind.css --config tailwind.config.js --output xxx\target\tmp\tailwind.css
Error: Unexpected token Ident("tr") at :10071:24

Leptos Dependencies

Full toml:

[workspace]
resolver = "2"
members = ["app", "frontend", "server"]

# need to be applied only to wasm build
[profile.release]
codegen-units = 1
lto = true
opt-level = 'z'

[workspace.dependencies]
leptos = { version = "0.6" }
leptos_meta = { version = "0.6" }
leptos_router = { version = "0.6" }
leptos_axum = { version = "0.6" }

axum = "0.7"
cfg-if = "1"
console_error_panic_hook = "0.1.7"
console_log = "1"
http = "1"
log = "0.4.20"
simple_logger = "4.2.0"
thiserror = "1"
tokio = { version = "1.33.0", features = ["full"] }
tower = { version = "0.4.13", features = ["full"] }
tower-http = { version = "0.5", features = ["full"] }
wasm-bindgen = "=0.2.92"

# See https://github.com/akesson/cargo-leptos for documentation of all the parameters.

# A leptos project defines which workspace members
# that are used together frontend (lib) & server (bin)
[[workspace.metadata.leptos]]
# this name is used for the wasm, js and css file names
name = "start-axum-workspace"

# the package in the workspace that contains the server binary (binary crate)
bin-package = "server"

# the package in the workspace that contains the frontend wasm binary (library crate)
lib-package = "frontend"

# The site root folder is where cargo-leptos generate all output. WARNING: all content of this folder will be erased on a rebuild. Use it in your server setup.
site-root = "target/site"

# The site-root relative folder where all compiled output (JS, WASM and CSS) is written
# Defaults to pkg
site-pkg-dir = "pkg"

# [Optional] The source CSS file. If it ends with .sass or .scss then it will be compiled by dart-sass into CSS. The CSS is optimized by Lightning CSS before being written to <site-root>/<site-pkg>/app.css
# style-file = "style/main.scss"

# The tailwind input file.
#
# Optional, Activates the tailwind build
tailwind-input-file = "style/tailwind.css"

# The tailwind config file.
#
# Optional, defaults to "tailwind.config.js" which if is not present
# is generated for you
tailwind-config-file = "tailwind.config.js"

# Assets source dir. All files found here will be copied and synchronized to site-root.
# The assets-dir cannot have a sub directory with the same name/path as site-pkg-dir.
#
# Optional. Env: LEPTOS_ASSETS_DIR.
assets-dir = "public"

# The IP and port (ex: 127.0.0.1:3000) where the server serves the content. Use it in your server setup.
site-addr = "127.0.0.1:3000"

# The port to use for automatic reload monitoring
reload-port = 3001

# [Optional] Command to use when running end2end tests. It will run in the end2end dir.
#   [Windows] for non-WSL use "npx.cmd playwright test"
#   This binary name can be checked in Powershell with Get-Command npx
end2end-cmd = "npx playwright test"
end2end-dir = "end2end"

#  The browserlist query used for optimizing the CSS.
browserquery = "defaults"

# Set by cargo-leptos watch when building with that tool. Controls whether autoreload JS will be included in the head
watch = false

# The environment Leptos will run in, usually either "DEV" or "PROD"
env = "DEV"

# The features to use when compiling the bin target
#
# Optional. Can be over-ridden with the command line parameter --bin-features
bin-features = []

# If the --no-default-features flag should be used when compiling the bin target
#
# Optional. Defaults to false.
bin-default-features = false

# The features to use when compiling the lib target
#
# Optional. Can be over-ridden with the command line parameter --lib-features
lib-features = []

# If the --no-default-features flag should be used when compiling the lib target
#
# Optional. Defaults to false.
lib-default-features = false

package.json

{
  "devDependencies": {
    "daisyui": "^4.12.10",
    "tailwindcss": "^3.4.6"
  }
}

tailwind.config.js:

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: [
    "./**/*.{html,js,rs}",
  ],
  theme: {
    extend: {},
  },
  plugins: [
    require('daisyui'),
  ],
}

To Reproduce

  1. create project from temlplage: cargo leptos new --git https://github.com/leptos-rs/start-axum-workspace/
  2. add tailwindcss: npm install -D tailwindcss; npx tailwindcss init
  3. install daisyui: npm i -D daisyui@latest
  4. run debug: cargo leptos watch

Expected behavior Hot daisyui can use in leptos.

benwis commented 1 month ago

So for this we use the standard executable provided by them. It sounds like that might have issues with DaisyUI. Perhaps you'd like to handle tailwind compilation outside cargo-leptos? I'm not sure what we could do here.

On Mon, Jul 22, 2024, at 7:46 AM, jiemo2187 wrote:

Describe the bug

Finished `dev` profile [unoptimized + debuginfo] target(s) in 0.79s
   Cargo finished cargo build --package=frontend --lib --target-dir=xxx\target\front --target=wasm32-unknown-unknown --no-default-features
   Front compiling WASM
Tailwind finished tailwind --input style/tailwind.css --config tailwind.config.js --output xxx\target\tmp\tailwind.css

Error: Unexpected token Ident("tr") at :10071:24 Leptos Dependencies

Full toml:

[workspace] resolver = "2" members = ["app", "frontend", "server"]

need to be applied only to wasm build

[profile.release] codegen-units = 1 lto = true opt-level = 'z'

[workspace.dependencies] leptos = { version = "0.6" } leptos_meta = { version = "0.6" } leptos_router = { version = "0.6" } leptos_axum = { version = "0.6" }

axum = "0.7" cfg-if = "1" console_error_panic_hook = "0.1.7" console_log = "1" http = "1" log = "0.4.20" simple_logger = "4.2.0" thiserror = "1" tokio = { version = "1.33.0", features = ["full"] } tower = { version = "0.4.13", features = ["full"] } tower-http = { version = "0.5", features = ["full"] } wasm-bindgen = "=0.2.92"

See https://github.com/akesson/cargo-leptos for documentation of all the parameters.

A leptos project defines which workspace members

that are used together frontend (lib) & server (bin)

[[workspace.metadata.leptos]]

this name is used for the wasm, js and css file names

name = "start-axum-workspace"

the package in the workspace that contains the server binary (binary crate)

bin-package = "server"

the package in the workspace that contains the frontend wasm binary (library crate)

lib-package = "frontend"

The site root folder is where cargo-leptos generate all output. WARNING: all content of this folder will be erased on a rebuild. Use it in your server setup.

site-root = "target/site"

The site-root relative folder where all compiled output (JS, WASM and CSS) is written

Defaults to pkg

site-pkg-dir = "pkg"

[Optional] The source CSS file. If it ends with .sass or .scss then it will be compiled by dart-sass into CSS. The CSS is optimized by Lightning CSS before being written to //app.css

style-file = "style/main.scss"

The tailwind input file.

#

Optional, Activates the tailwind build

tailwind-input-file = "style/tailwind.css"

The tailwind config file.

#

Optional, defaults to "tailwind.config.js" which if is not present

is generated for you

tailwind-config-file = "tailwind.config.js"

Assets source dir. All files found here will be copied and synchronized to site-root.

The assets-dir cannot have a sub directory with the same name/path as site-pkg-dir.

#

Optional. Env: LEPTOS_ASSETS_DIR.

assets-dir = "public"

The IP and port (ex: 127.0.0.1:3000) where the server serves the content. Use it in your server setup.

site-addr = "127.0.0.1:3000"

The port to use for automatic reload monitoring

reload-port = 3001

[Optional] Command to use when running end2end tests. It will run in the end2end dir.

[Windows] for non-WSL use "npx.cmd playwright test"

This binary name can be checked in Powershell with Get-Command npx

end2end-cmd = "npx playwright test" end2end-dir = "end2end"

The browserlist query used for optimizing the CSS.

browserquery = "defaults"

Set by cargo-leptos watch when building with that tool. Controls whether autoreload JS will be included in the head

watch = false

The environment Leptos will run in, usually either "DEV" or "PROD"

env = "DEV"

The features to use when compiling the bin target

#

Optional. Can be over-ridden with the command line parameter --bin-features

bin-features = []

If the --no-default-features flag should be used when compiling the bin target

#

Optional. Defaults to false.

bin-default-features = false

The features to use when compiling the lib target

#

Optional. Can be over-ridden with the command line parameter --lib-features

lib-features = []

If the --no-default-features flag should be used when compiling the lib target

#

Optional. Defaults to false.

lib-default-features = false package.json

{ "devDependencies": { "daisyui": "^4.12.10", "tailwindcss": "^3.4.6" } } tailwind.config.js:

/** @type {import('tailwindcss').Config} */ module.exports = { content: [ "./**/*.{html,js,rs}", ], theme: { extend: {}, }, plugins: [ require('daisyui'), ], } To Reproduce

  1. create project from temlplage: cargo leptos new --git https://github.com/leptos-rs/start-axum-workspace/
  2. add tailwindcss: npm install -D tailwindcss; npx tailwindcss init
  3. install daisyui: npm i -D ***@***.***
  4. run debug: cargo leptos watch

Expected behavior Hot daisyui can use in leptos.

— Reply to this email directly, view it on GitHub https://github.com/leptos-rs/cargo-leptos/issues/317, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABVBTCI6F6BIPGLSDWFRF3TZNULLZAVCNFSM6AAAAABLIPLGIKVHI2DSMVQWIX3LMV43ASLTON2WKOZSGQZDGMBWHA2DKNA. You are receiving this because you are subscribed to this thread.Message ID: @.***>

jiemo2187 commented 1 month ago

I think I'm in the wrong place to raise an issue, here's a request from daisyui: https://github.com/leptos-rs/leptos/pull/1293. But now this is not working properly. This issue can be closed.