[Solved] Error: PostCSS plugin autoprefixer requires PostCSS 8. Migration guide for end-users: https://github.com/postcss/postcss/wiki/PostCSS-8-for-end-users at Processor.normalize (\node_modules\postcss-loader\node_modules\postcss\lib\processor.js:153:15) at new Processor (\node_modules\postcss-loader\node_modules\postcss\lib\processor.js:56:25) at postcss


Based on the documentation link, you must manually upgrade the packages. Example in my case for a project based on webpack need just to update those dependencies:

"dependencies": {    
"autoprefixer": "^10.0.2",    
"postcss": "^8.1.7",    
"postcss-loader": "^4.0.4"  }

So you do not need to downgrade autoprefixer, delete package-lock.json file first and, open a terminal window then execute the below commands one by one.

npm i --save autoprefixer@^10.0.2 
npm i --save postcss@8.1.7  
npm i --save postcss-loader@4.0.4

once you execute the commands make sure they are properly installed by seeing in the package.json file as shown in the below image.

apply the postcss-loader configuration settings in the rule section of the webpack.config file and save it, finally restart the server by saying npm start.

        test: /\.css/,
        loaders: [
            loader: 'css-loader',
            options: {
              modules: true,
              localIdentName: '[local]---[hash:base64:5]',
              importLoaders: 1,
            loader: 'postcss-loader',
            options: {},


By manually installing the packages could solve this PostCSS plugin autoprefixer problem, we hope you find them helpful.

Shivaraju M

Over 3+ years experience in IT industry, good knowledge in . Net-based Web applications, windows applications, web services, and SPAs. I have played multiple roles related to technical delivery in multiple domains while working on over 10+ technologies. I am currently focused on continuous improvement and agile project management.

Post a Comment

Previous Post Next Post