You did not set any plugins, parser, or stringifier. Right now, PostCSS does nothing. (Laravel Mix)

4.3k Views Asked by At

Not sure how to resolve it, any ideas with the the below?

You did not set any plugins, parser, or stringifier. Right now, PostCSS does nothing. Pick plugins for your case on https://www.postcss.parts/ and use them in postcss.config.js.

My webpack.mix.js:

const mix = require('laravel-mix');
const oldMix = require('laravel-mix');
const path = require('path');
const glob = require('glob');
const PurgeCSSPlugin = require('purgecss-webpack-plugin');

//-- Website Mix --
mix.babelConfig({
   plugins: ['@babel/plugin-syntax-dynamic-import', '@babel/plugin-proposal-class-properties', '@babel/plugin-proposal-optional-chaining'],
});

mix.webpackConfig({
    watchOptions: {
        ignored: /node_modules/
    },
    stats: {
        warnings: false,
    },
    output: {
        chunkFilename: 'website/js/chunks/[chunkhash].js',//replace with your path
    },
    resolve: {
        alias: {
            '@fonts': path.resolve(__dirname, 'resources/website/styles/fonts'),
            '@images': path.resolve(__dirname, 'resources/website/images')
        }
    },
    plugins: [
        new PurgeCSSPlugin({
            paths: glob.sync('website/*',  { nodir: true }),
        })
    ]
});

mix.options({
    postCss: [
        require('autoprefixer'),
    ],
    fileLoaderDirs:  {
        fonts: 'website/fonts',
        images: 'website/images'
    }
});

mix.js('resources/website/index.js', 'public/website/js').react();
mix.version();
//-- Website Mix End --

//-- Old Application and Dashboard --
oldMix.webpackConfig({
    watchOptions: {
        ignored: /node_modules/
    }
});

oldMix.babel([
    'public/old/Scripts/Core/Primitive/jQuery.js',
    'public/old/Scripts/Core/Primitive/Slick.js',
    'public/old/Scripts/Core/Primitive/Angular.js',
    'public/old/Scripts/Core/Primitive/Bootstrap.js',
    'public/old/Scripts/Core/Primitive/Masonry.js',
    'public/old/Scripts/Core/Primitive/Images.js',
    'public/old/Scripts/Core/Primitive/Moment.js',
    'public/old/Scripts/Core/Primitive/Date.js',
    'public/old/Scripts/Core/Primitive/UTM.js',
    'public/old/Scripts/Dashboard/Tinymce/TinyMCE.js',
    'public/old/Scripts/Core/Primitive/Pusher.js',
    'public/old/Scripts/Core/Primitive/Reviews.js',
    'public/old/Scripts/Core/Primitive/Fancybox.js',
    'public/old/Scripts/Core/Primitive/Confetti.js',
    'public/old/Scripts/Core/Primitive/Signature.js',
], 'public/old/Build/Scripts/Primitive.js');

oldMix.babel([
    'public/old/Scripts/Core/Angular/*.js',
    'public/old/Scripts/Dashboard/Tinymce/UITinyMCE.js'
], 'public/old/Build/Scripts/Directives.js');

oldMix.babel([
    'public/old/Scripts/Dashboard/UI.js',
    'public/old/Scripts/Dashboard/Modules/OriginFactories.js',
    'public/old/Scripts/Dashboard/Modules/AddonsControllers.js',
    'public/old/Scripts/Dashboard/Modules/ProductsControllers.js',
    'public/old/Scripts/Dashboard/Modules/BoilerAdviceControllers.js',
    'public/old/Scripts/Dashboard/Controllers.js',
    'public/old/Scripts/Dashboard/Routes.js',
], 'public/old/Build/Scripts/Dashboard.js');

oldMix.babel([
    'public/old/Scripts/Application/UI.js',
    'public/old/Scripts/Application/Controllers.js',
    'public/old/Scripts/Application/Routes.js',
], 'public/old/Build/Scripts/Application.js');

    
oldMix.styles(['public/old/Styles/*.css'], 'public/old/Build/Styles/Core.css');
oldMix.styles(['public/old/Styles/Home/*.css'], 'public/old/Build/Styles/Home.css');
oldMix.styles(['public/old/Styles/Dashboard/*.css'], 'public/old/Build/Styles/Dashboard.css');
oldMix.styles(['public/old/Styles/Application/*.css'], 'public/old/Build/Styles/Application.css');
oldMix.version();
//-- Old Application and Dashboard End --

I've also got postcss.config.js:

module.exports = {
    plugins: [
        require('autoprefixer')
    ]
}
0

There are 0 best solutions below