not getting display: -webkit-flex with any options

[terion-name]

Safari 8 needs display: -webkit-flex.
With any options I pass — I on't get it. Even with such hardcore as:

gulp.task('cssOwn:build', () => {
  return gulp.src(path.src.css) // css: 'src/css/styles.scss',
    .pipe(sass({
      includePaths: [path.dist.css],
      errLogToConsole: true
    }))
    .pipe(sass().on('error', sass.logError))
    .pipe(prefixer({
      browser: ['last 10 versions']
    }))
    .pipe(sourcemaps.write('./maps'))
    .pipe(gulp.dest(path.dist.css))
    .pipe(connect.reload())
});

This results in:

ol.o-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: column;
      flex-flow: column;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between; }

It sets display: -webkit-box; for Safari 6, but not display: -webkit-flex for Safari 8

[ai]

Everything works in online demo.

You have a problem somewhere in environment.

I think it is related to this question (you should move browsers to browserslist config):
https://github.com/postcss/autoprefixer#no-prefixes-in-production

[terion-name]

@ai ooh. this is just insane. I've tried to solve this for about a week, and just now understood, that there was a typo in config. what a shame. sorry for bothering

[fervillz]

@terion-name, having the same problem, what is your type problem, can you share?

[terion-name]

@farcaller browser → browsers

[ai]

I will add warning for this case

[ai]

Added 90a1454

[terion-name]

@ai thanx!

[rouberg]

optimize-css-assets-webpack-plugin use cssnano as default processor, and cssnano removed all prefix, so autoprefixer seemed not work in production.
we can config like this:

new OptimizeCssAssetsPlugin({
    cssProcessorOptions: {
      safe: true,
      autoprefixer: { disable: true },
      discardComments: {
        removeAll: true
      }
    }
  });

the option of autoprefixer: { disable: true } will disable cssnano's autoprefixer and saved prefixer that already exist by ourselves.

also see the issue optimize-css-assets-webpack-plugin/issues/51

maybe some brother need this so I copy and attach this although this issue closed a long time ago.

[ai]

@rouberg there is better way. Always put browsers to .browserslistrc config (as we recommend). If you use browsers option, cssnano’s Autoprefixer (Babel and many other tools) will have different browsers. If you use Browserslist config, all your tools will have the same target browsers.