gulp: PostCSS failing - postcss version higher than version of postcss-import - gulp

Question

Im trying to transform my css with PostCss using Gulp.
When I add the cssnext plugin to PostCss I get the following error:
Unknown error from PostCSS plugin. Your current PostCSS version is 6.0.19, but postcss-import uses 4.1.16. Perhaps this is the source of the error below.
This is my gulpfile.js:
const gulp = require('gulp');
const postcss = require('gulp-postcss');
const concat = require('gulp-concat');
gulp.task('styles', function() {
const postCssPlugins = [
require('cssnext')()
];
gulp.src('src/css/*.css')
.pipe(postcss(postCssPlugins))
.pipe(concat('style.css'))
.pipe(gulp.dest('.'));
});
Full stack trace:
events.js:183
throw er; // Unhandled 'error' event
^
TypeError: styles.eachAtRule is not a function
at parseStyles (C:\gulp-test\node_modules\cssnext\node_modules\postcss-import\index.js:134:10)
at C:\gulp-test\node_modules\cssnext\node_modules\postcss-import\index.js:84:30
at LazyResult.run (C:\gulp-test\node_modules\postcss\lib\lazy-result.js:277:20)
at LazyResult.asyncTick (C:\gulp-test\node_modules\postcss\lib\lazy-result.js:192:32)
at processing.Promise.then._this2.processed (C:\gulp-test\node_modules\postcss\lib\lazy-result.js:231:20)
at new Promise (<anonymous>)
at LazyResult.async (C:\gulp-test\node_modules\postcss\lib\lazy-result.js:228:27)
at LazyResult.then (C:\gulp-test\node_modules\postcss\lib\lazy-result.js:134:21)
at process._tickCallback (internal/process/next_tick.js:188:7)
As far as I know, the postcss-import package is a dependency of cssnext. So what should I do?

Answer 1

I found the answer:
According to the website of cssnext, the package cssnext (which I used) is dead. The new package to use with PostCSS is postcss-cssnext:
const postCssPlugins = [
require('postcss-cssnext')()
];