title: gulp: PostCSS failing - postcss version higher than version of postcss-import
body: <p>Im trying to transform my css with PostCss using Gulp.</p>
  
  <p>When I add the cssnext plugin to PostCss I get the following error: </p>
  
  <p><code>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.</code></p>
  
  <p>This is my <code>gulpfile.js</code>:</p>
  
  <pre><code>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('.'));
  });
  </code></pre>
  
  <p>Full stack trace: </p>
  
  <pre><code>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 (&lt;anonymous&gt;)
  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)
  </code></pre>
  
  <p>As far as I know, the postcss-import package is a dependency of cssnext. So what should I do?</p>