DEV Community

Erik Guzman
Erik Guzman

Posted on

TIL: How having Dark mode classes not removed for Tailwind prod

Recently I did some work on my website Stream Closed Captioner to incorporate a dark mode. Locally everything went smoothly but I came across an issue in the production build where all the dark mode styles weren't being added.

After much head scratching and changing random things here and there I finally discovered a solution.

I needed to add the dark mode classes explicitly to the safe list of classes in my Tailwind config. Not sure why I had to since the official guide didn't mention it, but it sure did the trick. Here is my Tailwind config file for anyone looking to solve their issue,

module.exports = {
  darkMode: 'class',
  purge: {
    enabled: process.env.MIX_ENV === 'prod',
    content: ['../lib/**/*.eex', '../lib/**/*.leex'],
    options: {
      safelist: ['dark'],
    },
  },
  plugins: [
    ...
  ],
};
Enter fullscreen mode Exit fullscreen mode

Top comments (0)