Laravel11のBreezeのダークモード等の切り替え

[project-root]/node_modules/tailwindcss/stubs/config.full.js

module.exports = {
  content: [],
  presets: [],
  darkMode: 'class', // or 'media'
  ...
}

「darkMode:」の値を設定する。
‘class’だとライトモード,
‘media’だとダークモード
‘selector’だとPC依存のようです。
設定後はnpm run devまたはbuildを実行しviteを更新します。

20250213_後に気づいた事として
この対象ファイルはGitに含まれません。
その為、本番と開発環境にて同期しませんので注意して下さい。
また、tallwind.cssなので、Breeze以外はBootstrapとした場合は先にダークモードをどう取り扱うか決めておくべきだと思います。

私の場合は全てライトモードなので、開発と本番で設定する方法としています。

投稿者プロフィール

TakaharaRyuji
PAGE TOP