mix with tailwinds + postcss

webpack.mix.js

const mix = require('laravel-mix');

require('laravel-mix-purgecss');


/*

Using tailwinds @apply command will throw an error when compiling through postcss

-- fixes `@apply` cannot be used with

Generate the full tailwinds library with

# npx tailwind init tailwindcss.full.js --full 

 */




mix.js('resources/js/app.js', 'public/js');


mix.sass('resources/sass/app.scss', 'public/css')

        .options({
            processCssUrls: false,
            postCss: [
                require('postcss-css-variables')(),
                require('postcss-import')(),
                require('postcss-nesting')(),
                require('tailwindcss')('./tailwind.config.js'),
                require('tailwindcss')('./tailwindcss.full.js'),
            ]
        })
        
        .sourceMaps();




if (mix.inProduction()) {
    mix
            .version()
            .purgeCss();
}