Skip to content

Home

Jump to bottom
Matouš Borák edited this page Oct 17, 2023 · 17 revisions

Welcome to the Tailwind sorter wiki!

Integrating with IDEs / editors

There are several options to run the sorter from your IDE. All of them use some kind of a "watcher" - a background process that watches for file system changes and runs the script upon a change in a file. The watcher is sometimes integrated in the editor / IDE and there is one integrated in Ruby on Rails as well.

Using the listen gem (Ruby on Rails, VSCode)

One option is to leverage the listen gem which is also by default available in Ruby on Rails. For example, in Ruby on Rails, you can add an initializer to watch for your views and run the sorter upon change:

# config/initializers/tailwind_sorter_listener.rb

if Rails.env.development?
  require "listen"
  require "tailwind_sorter"

  listener = Listen.to(Rails.root.join("app/views").to_s, only: /\.(slim|erb)$/) do |modified, added, removed|
    (modified + added).each do |changed_file|
      TailwindSorter::Sorter.run(changed_file)
    end
  end

  listener.start
end

For some editors / IDEs, this is all that is needed for the tailwind classes to be automatically sorted on save. For example, VSCode reflects external changes to editor files instantly. On the other hand, Rubymine et al does not and you have to either use the File ⟶ Reload All from Disk action (ctrl + alt + y) after saving a file or use a File watcher plugin instead of the listen gem / initializer, see below.

Using file watchers integrated in Editors / IDEs

Other stuff

Clone this wiki locally