Tailwind CSS Multiple Config Files using Webpack Mix with Laravel

On any web development using tailwind you need a config file, but there are occasions when you want to have several configurations to have many .css files, for example a dark and a light theme.

The solution that I found is to configure your webpack.mix.js file like this.

mix.sass('resources/sass/light.scss', 'public/light/app.css', {}, [
    tailwindcss('./tailwind.light.config.js'),
])
.sass('resources/sass/dark.scss', 'public/css/dark/app.css', {}, [
    tailwindcss('./tailwind.dark.config.js'),
])
.options({
    processCssUrls: false,
});