I am trying to use PostCSS plugin autoprefixer with grunt. I have gone through many articles and Stackoverflow answers which were relevant but still I am getting "Warning: [object Object] is not a PostCSS plugin Use --force to continue".
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
sass: {
dist: {
files: {
'css/style.css' : 'scss/style.scss'
}
}
},
watch: {
css: {
files: '**/*.scss',
tasks: ['sass']
}
},
postcss: {
options: {
map: true,
processors: [
require('autoprefixer')()
]
},
dist: {
src: 'css/*.css'
}
}
});
grunt.loadNpmTasks('grunt-contrib-sass');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-postcss');
grunt.registerTask('dev',['sass','watch']);
grunt.registerTask('build',['sass', 'postcss']);
}
package.json
"devDependencies": {
"grunt": "^1.4.0",
"grunt-contrib-sass": "^2.0.0",
"grunt-contrib-watch": "^1.1.0",
"grunt-postcss": "^0.9.0",
"postcss": "^8.3.0",
"autoprefixer": "^10.2.6"
}
I am a newbie so please help.
Not sure yet what the root cause is, but downgrading autoprefixer to version 9 solves the issue
package.json
"devDependencies": {
"grunt": "^1.4.0",
"grunt-contrib-sass": "^2.0.0",
"grunt-contrib-watch": "^1.1.0",
"grunt-postcss": "^0.9.0",
"postcss": "^8.3.0",
"autoprefixer": "^9.8.6"
}