Could not compile daisyUI plugin with tailwindcss

[stalexxx]

Environment

Elixir version (elixir -v): Elixir 1.18.3 (compiled with Erlang/OTP 27)
Phoenix version (mix deps): phoenix 1.8.0-rc.1 (Hex package) (mix)
Operating system: macos
nodejs: 23

Actual behavior

Css is not compiling:

❯ mix tailwind nux
Error: The plugin "../vendor/daisyui" does not accept options
** (Mix) mix tailwind nux exited with 1

then i got deeper and made this

❯ _build/tailwind-macos-arm64 -i  ./assets/css/app.css  -o priv/static/assets/css/app.css
Error: The plugin "../vendor/daisyui" does not accept options

Then i asked LLM (lol) and it said it is not good idea to use @plugin in css I actually could not find this feature in tailwindcss doc.

then i checked at https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_syntax/At-rule and it never saw this "@plugin"

so, I am very confused, because thing worked once in my env but then broke

[SteffenDE]

Hey @stalexxx,

what version of Tailwind is set in your config? Can you provide steps to reproduce? Does the content of the daisyui file look right (you can compare it to https://github.com/phoenixframework/phoenix/blob/main/installer/templates/phx_assets/daisyui.js).

[stalexxx]

Hey @stalexxx,

what version of Tailwind is set in your config? Can you provide steps to reproduce? Does the content of the daisyui file look right (you can compare it to https://github.com/phoenixframework/phoenix/blob/main/installer/templates/phx_assets/daisyui.js).

I tried 4.0.9 and 4.1.4 I just made mix phx.new name I tried to make curl for new daisyUI.js and checked with your https://github.com/phoenixframework/phoenix/blob/main/installer/templates/phx_assets/daisyui.js file

so, to make it clear

❯ mix archive.install hex phx_new 1.8.0-rc.1 --force
❯ mix phx.new tst
❯ mix assets.setup
❯ mix assets.build
Error: The plugin "../vendor/daisyui" does not accept options
** (Mix) `mix tailwind tst` exited with 1


_build/tailwind-macos-arm64 --version   
...
≈ tailwindcss v4.0.9

[SteffenDE]

This is very weird, works just fine here:

~> mix archive.install hex phx_new 1.8.0-rc.1 --force
Resolving Hex dependencies...
Resolution completed in 0.008s
New:
  phx_new 1.8.0-rc.1
...
* creating /Users/steffen/.mix/archives/phx_new-1.8.0-rc.1
~> mix phx.new tst
~> cd tst
~/tst> mix assets.build
/*! 🌼 daisyUI 5.0.8 */
≈ tailwindcss v4.0.9

Done in 80ms

  ../priv/static/assets/js/app.js  263.3kb

⚡ Done in 14ms

Just as a note: the @plugin directive is from Tailwind.

Can you check if you have any node_modules folder in any directory above the folder you're running the project in? I've seen weird stuff happening with tailwind trying to load modules from any node_modules folder.

[stalexxx]

weird indeed no node_modules around. I rechecked my node version, tried with different versions, and with different tailwind version as well the most wierd is that it worked in past as i remember

This is very weird, works just fine here:

~> mix archive.install hex phx_new 1.8.0-rc.1 --force
Resolving Hex dependencies...
Resolution completed in 0.008s
New:
  phx_new 1.8.0-rc.1
...
* creating /Users/steffen/.mix/archives/phx_new-1.8.0-rc.1
~> mix phx.new tst
~> cd tst
~/tst> mix assets.build
/*! 🌼 daisyUI 5.0.8 */
≈ tailwindcss v4.0.9

Done in 80ms

  ../priv/static/assets/js/app.js  263.3kb

⚡ Done in 14ms

Just as a note: the @plugin directive is from Tailwind.

Can you check if you have any node_modules folder in any directory above the folder you're running the project in? I've seen weird stuff happening with tailwind trying to load modules from any node_modules folder.

[stalexxx]

@SteffenDE that is wierd qustion, but what is your tailwindcss bin file version? I tried on linux and it works I use macos-arm64 I cannot imagine any other difference

[SteffenDE]

It must be something specific with your setup :(

I'm running macOS on ARM as well - binary is _build/tailwind-macos-arm64, version 4.0.9.

If anyone else can reproduce, please let us know!

[gtaranti]

mix assets.build works correctly. But the 'Tailwind CSS Intellisense" vscode extension is broken.

From the extension output : [assets/css/app.css] Initializing... [assets/css/app.css] Failed to load workspace modules. [assets/css/app.css] Using bundled version oftailwindcss: v4.1.1 [assets/css/app.css] Building... [Error - 4:15:59 PM] Loading fallback stylesheet for: tailwindcss [Error - 4:15:59 PM] Unable to load plugin: ../vendor/heroicons Error: Can't resolve 'tailwindcss/plugin' in '/var/home/gt/src/phx18rc3/assets/vendor' at p (/var/home/gt/.vscode/extensions/bradlc.vscode-tailwindcss-0.14.20/dist/tailwindServer.js:130:7155)

The extension was working OK in Phoenix 1.7

[SteffenDE]

This seems to be an issue with the intellisense plugin, see: https://github.com/tailwindlabs/tailwindcss-intellisense/issues/1301

[gtaranti]

So, is it recommended to install the plugins in the assets folder via npm in order to have intellisense, as per this isuue? Because otherwise, using tailwindcss in phoenix would be very difficult without the intellisense.

[dch]

also able to reproduce this, albeit a more esoteric setup. Works happily on macOS, no stray node_modules to be found.

Installing tailwind is not so straightforwards on FreeBSD, needing tailwind4 and a small config.exs tweak on top of a vanilla 1.8.0-rc3 phx repo

• FreeBSD 14.3-RELEASE amd64
• node 24, elixir 1.19.rc.0, OTP28
• phoenix 1.8.0-rc.4 (Hex package) (mix)
• ≈ tailwindcss v4.1.10

The repo was built via:

$ mix archive.install hex phx_new 1.8.0-rc.3 --force
$ mix phx.new tst
$ cd tst && ... apply patch from above

$ mix assets.build
≈ tailwindcss v4.1.10

Error: The plugin "../vendor/daisyui" does not accept options
** (Mix) `mix tailwind tst` exited with 1

$ echo $PATH
/usr/local/lib/erlang28/bin /sbin /bin /usr/sbin /usr/bin /usr/local/sbin /usr/local/bin

[hrubi]

@dch this can be worked around by applying steps in https://github.com/tailwindlabs/tailwindcss-intellisense/issues/1301#issuecomment-2784572273

[shepelevstas]

Hello!

Had the same issue with daisyui. On macOS Big Sur there is no Tailwindcss CLI binary v4 for me, so I needed to install node version:

• in project root: npm i --prefix assets -D tailwindcss @tailwindcss/cli daisyui),
• then in config/config.exs in config :tailwind I added version_check: false and path: Path.expand("../assets/node_modules/.bin/tailwindcss", __DIR__).

Then I've got this daisy error.

• then I changed assets/css/app.css a bit: changed "../vendor/daisyui" to just "daisyui" and "../vendor/daisyui-theme" to "daisyui/theme".

Now it builds ok. Didn't change anything in watchers or aliases, didn't do anything with the PATH. I guess I can even delete assets/vendor/daisyui.js and assets/vendor/daisyui-theme.js now.