Tailwindcssでimportantで優先させる方法

tailwindcssを使っていると、

デフォルトでは、

important属性はついていないので、

他のUIライブラリやCSSを組み合わせたときに、

実際に反映されないことが起きる。

この事象に対しての対応方法。

Tailwindcssの設定変更

設定ファイル

tailwind.config.js

設定内容

上記のファイルに、

「important」の設定を追加

module.exports = {
  content: [
    "./src/**/*.{js,jsx,ts,tsx}",
  ],
  theme: {
    extend: {},
  },
  plugins: [
  ],
  important: true
}