Update for Tailwind CSS v4 #164
Conversation
Tailwind CSS v4 comes with new configurations and build scripts. This updates the installer for Tailwind to include those changes.
lib/install/tailwind/install.rb
Outdated
|
|
||
| say "Add build:css script" | ||
| add_package_json_script "build:css", | ||
| "tailwindcss -i ./app/assets/stylesheets/application.tailwind.css -o ./app/assets/builds/application.css --minify" | ||
| "npx @tailwindcss/cli -i ./app/assets/stylesheets/application.tailwind.css -o ./app/assets/builds/application.css --minify" |
There was a problem hiding this comment.
It would be interesting to add to lib/install/helpers.rb something to support bun in order to use bunx/npx depending of what tools the user wanted to use.
def bundler_x_cmd
using_bun? ? "bunx" : "npx"
endThen you could do:
"#{bundler_x_cmd} @tailwindcss/cli -i ./app/assets/stylesheets/application.tailwind.css -o ./app/assets/builds/application.css --minify"There was a problem hiding this comment.
Sounds good to me. I just added support in my latest commit #a0df0b7
| @@ -2,6 +2,6 @@ | |||
| "name": "app", | |||
| "private": "true", | |||
| "scripts": { | |||
| "build:css": "tailwindcss -i ./app/assets/stylesheets/application.tailwind.css -o ./app/assets/builds/application.css" | |||
| "build:css": "npx @tailwindcss/cli -i ./app/assets/stylesheets/application.tailwind.css -o ./app/assets/builds/application.css" | |||
There was a problem hiding this comment.
Is it really necessary to run npx if you add @tailwindcss/cli as a depedency?
Also, would this also be a place to use bunx if using bun?
There was a problem hiding this comment.
In my testing, something like npx or bunx is necessary to run the new @tailwindcss/cli package. The Tailwind docs have this, so I was going off that.
To be honest, I'm not sure this package.json file is necessary.
There was a problem hiding this comment.
It is necessary because cssbundling-rails and jsbundling-rails are enhancing some rake tasks like precompile:assets to call this build and build:css task present in the package.json
There was a problem hiding this comment.
@navidemad I mean the package.json file inside the lib/install/tailwind directory. I see no reference to it in rake tasks or elsewhere. I could be mistaken, of course.
|
Is there anything i can help with to advance with this PR? Is there anything missing? For me, all the changes are working. Hope to see |
This is a pull request based on #163
Tailwind CSS v4 has new configurations that are simpler than v3 and prior.
Summary of changes:
tailwind.config.jsfile@tailwinddirectives for normal@import "tailwindcss"support.npxand@tailwindcss/clito build cssLet me know if you see any red flags!