Search code examples
tailwind-csslaravel-mixpostcss

laravel mix --production not generate tailwind css file correctly


i am building laravel app with inertiajs and tailwind libraries. when build for dev environment (npm run dev), the app run without issue. but if i build for production (npm run prod), the page not rendered correctly. i seems like there is missing css class from tailwind. some of utility class not exist. following is my laravel mix config:

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

mix.js('resources/js/app.js', 'public/js')
    .js('resources/frontjs/front.js', 'public/js')
    .vue()
    //.extract()
    .options({
        processCssUrls: false,
    })
    .postCss('resources/css/app.css', 'public/css', [
        require('postcss-import'),
        require('tailwindcss'),
    ])
    .postCss('resources/css/frontpage.css', 'public/css', [
        require('postcss-import'),
        require('tailwindcss'),
    ])
    .tailwind('./tailwind.config.js')
    .webpackConfig(require('./webpack.config'));

i use tailwindcss version 2.2.4, laravel mix version 6.0.25 and mix-tailwindcss 1.3.0. any suggestion to fix this issue?


Solution

  • solved: i forgot to add vuejs files to purge path on tailwind config. issue solved after the path added.