rails7 + tailwindcss + simple_formでcssが意図せずpurgeされ効かなくなる問題

rails7ではtailwindの機能により、erbやjavascript中に出現していないcssクラスは除外（purge）し、実際に使用されるcssクラスのみがコンパイル後に出力される。

一方、simple_formはform builderとして、設定済みのerbやcssをviewやhelperに実装せずに出力するため、デフォルトの設定だとtailwindに認識されずpurgeされる。そのため、以下のように記述したとき、出力されるwebページにはcssが適用されれない。

app/config/initializers/simple_form.rb

config.wrappers tag: 'div', class: 'any-form-wrapper-class' do |b|
  b.use :html5
  b.use :placeholder
  b.use :input, class: 'any-form-input-class'
end

app/assets/stylesheets/application.tailwind.css

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer components {
  .any-form-wrapper-class {
    @apply block mb-6;
  }

  .any-form-input-class {
    @apply shadow appearance-none border border-gray-300 rounded w-full py-2 px-3 bg-white focus:outline-none focus:ring-0 focus:border-blue-500 text-gray-400 leading-6 transition-colors duration-200 ease-in-out;
  }
}

解決策として、tailwindcssがアセットのコンパイル時に使用すべきクラス名のソースとしてsimple_form.rbを追加する。

app/config/tailwind.config.js

const defaultTheme = require("tailwindcss/defaultTheme");

module.exports = {
  content: [
    "./app/helpers/**/*.rb",
    "./app/javascript/**/*.js",
    "./app/views/**/*",
    "./config/initializers/simple_form.rb", // 追加
  ],
};

これにより、simple_form.rb内に出現する文字列からクラス名を検出し、コンパイル時に当該クラスを出力してくれるようになる。