Gulp, postcss and UnCSS - npm

Question

I'm trying to clean up my css and use UnCSS with gulp and Postcss.
I have this:
gulp.task('optim-css', function() {
var stream1 = gulp.src(['dev/css/bootstrap.min.css','dev/css/custom.css'])
.pipe(postcss([ rucksack() ]))
.pipe(postcss(uncss({
html: ['http://localhost/olssonseder/','http://localhost/olssonseder/lyssna/','http://localhost/olssonseder/repertoar/','http://localhost/olssonseder/kontakta/','http://localhost/olssonseder/kontakta/','http://localhost/olssonseder/om-gitarren/'],
ignore: [new RegExp('.b-lazy*'),
new RegExp('.stickyFooter')]
}))
);
var stream2 = gulp.src(['dev/css/responsive-nav.css','dev/css/lity.css','dev/css/mp3-player-button.css'])
return merge(stream1, stream2)
.pipe(concat('styles.css'))
.pipe(cleanCSS())
.pipe(gulp.dest(''))
.pipe(browserSync.stream());
});
But I get this error and I just can't figure out why:
[14:21:49] TypeError: UnCSS: expected a callback
at init (C:\Users\Nicke\Documents\PortableApps\UwAmp\www\olssonseder\wp-content\themes\bastema\node_modules\uncss\src\uncss.js:176:15)
at Gulp.<anonymous> (C:\Users\Nicke\Documents\PortableApps\UwAmp\www\olssonseder\wp-content\themes\bastema\gulpfile.js:48:23)
at module.exports (C:\Users\Nicke\Documents\PortableApps\UwAmp\www\olssonseder\wp-content\themes\bastema\node_modules\orchestrator\lib\runTask.js:34:7)
at Gulp.Orchestrator._runTask (C:\Users\Nicke\Documents\PortableApps\UwAmp\www\olssonseder\wp-content\themes\bastema\node_modules\orchestrator\index.js:273:3)
at Gulp.Orchestrator._runStep (C:\Users\Nicke\Documents\PortableApps\UwAmp\www\olssonseder\wp-content\themes\bastema\node_modules\orchestrator\index.js:214:10)
at Gulp.Orchestrator.start (C:\Users\Nicke\Documents\PortableApps\UwAmp\www\olssonseder\wp-content\themes\bastema\node_modules\orchestrator\index.js:134:8)
at C:\Users\Nicke\Documents\PortableApps\UwAmp\www\olssonseder\wp-content\themes\bastema\node_modules\gulp\bin\gulp.js:129:20
at process._tickCallback (internal/process/next_tick.js:150:11)
at Function.Module.runMain (module.js:703:11)
at startup (bootstrap_node.js:190:16)
[14:21:52] Finished 'optim-js' after 2.75 s
[14:21:52] Finished 'optim-deferjs' after 2.73 s
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! bastema#1.0.0 gi: `gulp init`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the bastema#1.0.0 gi script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Nicke\AppData\Roaming\npm-cache\_logs\2018-07-27T12_21_52_508Z-debug.log
Anyone has an idea as to why this is happening?

Answer 1

I ran into the same problem. After creating a callback and running into other problems, I found that uncss could not be used directly with postcss. Use postcss-uncss instead and it works as expected.
From: https://github.com/uncss/uncss
Note: Depending on your environment, you might not be able to use
uncss as a PostCSS plugin since the plugin is not directly exported.
In such cases, use the wrapper library postcss-uncss.
Here is the postcss-uncss library: https://github.com/uncss/postcss-uncss