next.js 如何避免在Tailwind CSS中将主题更改为深色模式

k0pti3hp  于 2023-06-05  发布在  其他
关注(0)|答案(1)|浏览(318)

我在Next.js项目中使用tailwindcss。我不使用黑暗的风格在我的组件,所有的组件都在轻的风格。但是当操作系统主题更改为黑暗模式时,我的网站显示为黑暗。
如何禁用黑暗模式自动更改我的项目?

uelo1irk

uelo1irk1#

NextJs本身使用暗模式,因此它被配置为以这种方式工作。
你可以做的是通过执行以下操作来始终强制使用灯光模式:

module.exports = {
  darkMode: 'class',
  // ...
}

然后在你的页面的标题,你可以有这个小脚本,将覆盖一切,只是使用轻模式。

localStorage.theme = 'light'

资料来源:https://tailwindcss.com/docs/dark-mode#supporting-system-preference-and-manual-selection

相关问题