diff --git a/CHANGELOG.md b/CHANGELOG.md index 47d080f9..d662d7a9 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,21 @@ # `tailwindcss-rails` Changelog +## v4.2.3 / 2025-05-02 + +### Improved + +* The "tailwindcss:upgrade" task now pins to v4.1.4 of the `@tailwindcss/upgrade` tool. #544 @flavorjones + + +## v4.2.2 / 2025-04-05 + +### Improved + +* The "tailwindcss:upgrade" task now uses the latest version of the `@tailwindcss/upgrade` tool. #529 @flavorjones +* The "verbose" flag on Rails tasks now emits additional tailwind CLI debugging info (e.g., `bin/rails tailwindcss:build[verbose]`). #530 @flavorjones +* Simplified the scaffold templates, removing unnecessary `div` tags. @523 @patriciomacadden + + ## v4.2.1 / 2025-03-19 ### Fixed diff --git a/Gemfile.lock b/Gemfile.lock index 459f089e..9b0500db 100644 --- a/Gemfile.lock +++ b/Gemfile.lock @@ -1,7 +1,7 @@ PATH remote: . specs: - tailwindcss-rails (4.2.0) + tailwindcss-rails (4.2.2) railties (>= 7.0.0) tailwindcss-ruby (~> 4.0) @@ -140,11 +140,11 @@ GEM io-console (~> 0.5) securerandom (0.4.1) stringio (3.1.5) - tailwindcss-ruby (4.0.14) - tailwindcss-ruby (4.0.14-aarch64-linux-gnu) - tailwindcss-ruby (4.0.14-arm64-darwin) - tailwindcss-ruby (4.0.14-x86_64-darwin) - tailwindcss-ruby (4.0.14-x86_64-linux-gnu) + tailwindcss-ruby (4.1.7) + tailwindcss-ruby (4.1.7-aarch64-linux-gnu) + tailwindcss-ruby (4.1.7-arm64-darwin) + tailwindcss-ruby (4.1.7-x86_64-darwin) + tailwindcss-ruby (4.1.7-x86_64-linux-gnu) thor (1.3.2) timeout (0.4.3) tzinfo (2.0.6) diff --git a/README.md b/README.md index f7afe7a8..158b1750 100644 --- a/README.md +++ b/README.md @@ -124,7 +124,7 @@ Then, run `bin/rails tailwindcss:upgrade`. Among other things, this will try to - If present, moves `app/assets/stylesheets/application.tailwind.css` to `app/assets/tailwind/application.css`. - Removes unnecessary `stylesheet_link_tag "tailwindcss"` tags from the application layout. - Removes references to the Inter font from the application layout. -- Runs the upstream upgrader (note: requires `npx` to run the one-time upgrade, but highly recommended). +- Runs v4.1.4 of the upstream upgrader (note: requires `npx` to run the one-time upgrade, but highly recommended). @@ -145,7 +145,7 @@ $ bin/rails tailwindcss:upgrade remove app/assets/stylesheets/application.tailwind.css 10.9.0 Running the upstream Tailwind CSS upgrader - run npx @tailwindcss/upgrade@next --force --config /home/user/myapp/config/tailwind.config.js from "." + run npx @tailwindcss/upgrade@4.1.4 --force --config /home/user/myapp/config/tailwind.config.js from "." ≈ tailwindcss v4.0.0 │ Searching for CSS files in the current directory and its subdirectories… │ ↳ Linked `./config/tailwind.config.js` to `./app/assets/tailwind/application.css` @@ -403,30 +403,63 @@ If you need to use a custom input or output file, you can run `bundle exec tailw ## Troubleshooting -Some common problems experienced by users ... +When having trouble with `tailwindcss:build` or `tailwindcss:watch`, the first thing you should do is collect some diagnostic information by setting the "verbose" flag, which will emit: + +1. the command being run (so you can try running `tailwindcss` yourself without the gem's help) +2. additional debugging output from `tailwindcss` by setting the env var `DEBUG=1` + +Here's what that looks like: + +``` sh +$ bin/rails tailwindcss:build[verbose] + +Running: /path/to/tailwindcss-ruby-4.0.17-x86_64-linux-gnu/exe/x86_64-linux-gnu/tailwindcss -i /home/flavorjones/code/oss/tailwindcss-rails/My Workspace/test-install/app/assets/tailwind/application.css -o /home/flavorjones/code/oss/tailwindcss-rails/My Workspace/test-install/app/assets/builds/tailwind.css --minify +≈ tailwindcss v4.0.17 + +Done in 37ms + +[38.22ms] [@tailwindcss/cli] (initial build) +[11.90ms] ↳ Setup compiler +[ 6.52ms] ↳ Scan for candidates +[10.39ms] ↳ Build CSS +[ 1.69ms] ↳ Optimize CSS +[ 5.80ms] ↳ Write output +``` + +### The `watch` command is hanging + +There is a [known issue](https://github.com/tailwindlabs/tailwindcss/issues/17246#issuecomment-2753067488) running `tailwindcss -w` (that's the CLI in watch mode) when the utility `watchman` is also installed. + +Please try uninstalling `watchman` and try running the watch task again. + ### Lost keystrokes or hanging when using terminal-based debugging tools (e.g. IRB, Pry, `ruby/debug`...etc.) with the Puma plugin We've addressed the issue and you can avoid the problem by upgrading `tailwindcss-rails` to [v2.4.1](https://github.com/rails/tailwindcss-rails/releases/tag/v2.4.1) or later versions. + ### Running in a docker container exits prematurely If you are running `rails tailwindcss:watch` as a process in a Docker container, set `tty: true` in `docker-compose.yml` for the appropriate container to keep the watch process running. If you are running `rails tailwindcss:watch` in a docker container without a tty, pass the `always` argument to the task to instruct tailwindcss to keep the watcher alive even when `stdin` is closed: `rails tailwindcss:watch[always]`. If you use `bin/dev` then you should modify your `Procfile.dev`. + ### Conflict with sassc-rails Tailwind uses modern CSS features that are not recognized by the `sassc-rails` extension that was included by default in the Gemfile for Rails 6. In order to avoid any errors like `SassC::SyntaxError`, you must remove that gem from your Gemfile. + ### Class names must be spelled out For Tailwind to work, your class names need to be spelled out. If you need to make sure Tailwind generates class names that don't exist in your content files or that are programmatically composed, use the [safelist option](https://tailwindcss.com/docs/content-configuration#safelisting-classes). + ### `ERROR: Cannot find the tailwindcss executable` for supported platform See https://github.com/flavorjones/tailwindcss-ruby for help. + ### Using asset-pipeline assets In Rails, you want to use [assets from the asset pipeline to get fingerprinting](https://guides.rubyonrails.org/asset_pipeline.html#fingerprinting-versioning-with-digest-based-urls). However, Tailwind isn't aware of those assets. diff --git a/lib/generators/tailwindcss/scaffold/templates/index.html.erb.tt b/lib/generators/tailwindcss/scaffold/templates/index.html.erb.tt index 848c97fb..12a0db16 100644 --- a/lib/generators/tailwindcss/scaffold/templates/index.html.erb.tt +++ b/lib/generators/tailwindcss/scaffold/templates/index.html.erb.tt @@ -18,9 +18,7 @@
<%%= link_to "Show", <%= model_resource_name(singular_table_name) %>, class: "w-full sm:w-auto text-center rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %> <%%= link_to "Edit", <%= edit_helper(singular_table_name, type: :path) %>, class: "w-full sm:w-auto text-center rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %> -
- <%%= button_to "Destroy", <%= model_resource_name %>, method: :delete, class: "w-full sm:w-auto rounded-md px-3.5 py-2.5 text-white bg-red-600 hover:bg-red-500 font-medium cursor-pointer", data: { turbo_confirm: "Are you sure?" } %> -
+ <%%= button_to "Destroy", <%= model_resource_name %>, method: :delete, class: "w-full sm:w-auto rounded-md px-3.5 py-2.5 text-white bg-red-600 hover:bg-red-500 font-medium cursor-pointer", data: { turbo_confirm: "Are you sure?" } %>
<%% end %> diff --git a/lib/generators/tailwindcss/scaffold/templates/show.html.erb.tt b/lib/generators/tailwindcss/scaffold/templates/show.html.erb.tt index b6f153c2..2b6687d2 100644 --- a/lib/generators/tailwindcss/scaffold/templates/show.html.erb.tt +++ b/lib/generators/tailwindcss/scaffold/templates/show.html.erb.tt @@ -11,7 +11,5 @@ <%%= link_to "Edit this <%= human_name.downcase %>", <%= edit_helper(type: :path) %>, class: "w-full sm:w-auto text-center rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %> <%%= link_to "Back to <%= human_name.pluralize.downcase %>", <%= index_helper %>_path, class: "w-full sm:w-auto text-center mt-2 sm:mt-0 sm:ml-2 rounded-md px-3.5 py-2.5 bg-gray-100 hover:bg-gray-50 inline-block font-medium" %> -
- <%%= button_to "Destroy this <%= human_name.downcase %>", <%= model_resource_name(prefix: "@") %>, method: :delete, class: "w-full rounded-md px-3.5 py-2.5 text-white bg-red-600 hover:bg-red-500 font-medium cursor-pointer", data: { turbo_confirm: "Are you sure?" } %> -
+ <%%= button_to "Destroy this <%= human_name.downcase %>", <%= model_resource_name(prefix: "@") %>, method: :delete, form_class: "sm:inline-block mt-2 sm:mt-0 sm:ml-2", class: "w-full rounded-md px-3.5 py-2.5 text-white bg-red-600 hover:bg-red-500 font-medium cursor-pointer", data: { turbo_confirm: "Are you sure?" } %> diff --git a/lib/install/upgrade_tailwindcss.rb b/lib/install/upgrade_tailwindcss.rb index 6266583a..d6ecadab 100644 --- a/lib/install/upgrade_tailwindcss.rb +++ b/lib/install/upgrade_tailwindcss.rb @@ -45,8 +45,14 @@ end if system("npx --version") + # We're pinning to v4.1.4 because v4.1.5 of the upgrade tool introduces a dependency version check + # on tailwind and I haven't been able to figure out how to get that to work reliably and I am + # extremely frustrated with the whole thing. See #544 + # + # At some point we will probably need to unpin this at which point I am sincerely hoping that + # someone else will do it. say "Running the upstream Tailwind CSS upgrader" - command = Shellwords.join(["npx", "@tailwindcss/upgrade@next", "--force", "--config", TAILWIND_CONFIG_PATH.to_s]) + command = Shellwords.join(["npx", "@tailwindcss/upgrade@4.1.4", "--force", "--config", TAILWIND_CONFIG_PATH.to_s]) success = run(command, abort_on_failure: false) unless success say "The upgrade tool failed!", :red diff --git a/lib/tailwindcss/commands.rb b/lib/tailwindcss/commands.rb index bef42fd2..99ad30e0 100644 --- a/lib/tailwindcss/commands.rb +++ b/lib/tailwindcss/commands.rb @@ -29,6 +29,12 @@ def watch_command(always: false, poll: false, **kwargs) end end + def command_env(verbose:) + {}.tap do |env| + env["DEBUG"] = "1" if verbose + end + end + def rails_css_compressor? defined?(Rails) && Rails&.application&.config&.assets&.css_compressor.present? end diff --git a/lib/tailwindcss/version.rb b/lib/tailwindcss/version.rb index 86e02ae2..7ab2db8d 100644 --- a/lib/tailwindcss/version.rb +++ b/lib/tailwindcss/version.rb @@ -1,3 +1,3 @@ module Tailwindcss - VERSION = "4.2.1" + VERSION = "4.2.3" end diff --git a/lib/tasks/build.rake b/lib/tasks/build.rake index 3044ff05..603c8059 100644 --- a/lib/tasks/build.rake +++ b/lib/tasks/build.rake @@ -2,9 +2,13 @@ namespace :tailwindcss do desc "Build your Tailwind CSS" task build: :environment do |_, args| debug = args.extras.include?("debug") + verbose = args.extras.include?("verbose") + command = Tailwindcss::Commands.compile_command(debug: debug) - puts command.inspect if args.extras.include?("verbose") - system(*command, exception: true) + env = Tailwindcss::Commands.command_env(verbose: verbose) + puts "Running: #{Shellwords.join(command)}" if verbose + + system(env, *command, exception: true) end desc "Watch and build your Tailwind CSS on file changes" @@ -12,9 +16,13 @@ namespace :tailwindcss do debug = args.extras.include?("debug") poll = args.extras.include?("poll") always = args.extras.include?("always") + verbose = args.extras.include?("verbose") + command = Tailwindcss::Commands.watch_command(always: always, debug: debug, poll: poll) - puts command.inspect if args.extras.include?("verbose") - system(*command) + env = Tailwindcss::Commands.command_env(verbose: verbose) + puts "Running: #{Shellwords.join(command)}" if verbose + + system(env, *command) rescue Interrupt puts "Received interrupt, exiting tailwindcss:watch" if args.extras.include?("verbose") end