iamdebadipti
iamdebadipti

Reputation: 161

How to convert SCSS to CSS with auto vendor prefixer?

Is there any way of converting SCSS to CSS with automatic vendor prefixes? I have used node-sass with npm and it worked perfectly, but it is not rendering vendor prefixes automatically (like box-sizing: border-box; or display: flex; properties)

Note: I have used the sass compiler extension VS Code, but it is rendering the CSS and CSS.MAP files in the same directory of the SCSS files which I do not want.

Upvotes: 1

Views: 3119

Answers (2)

iamdebadipti
iamdebadipti

Reputation: 161

I found postcss works perfectly. I am doing this:

Gulp

Use gulp-postcss and gulp-sourcemaps.

gulp.task('css', () => {
  const postcss    = require('gulp-postcss')
  const sourcemaps = require('gulp-sourcemaps')

  return gulp.src('src/**/*.css')
    .pipe( sourcemaps.init() )
    .pipe( postcss([ require('precss'), require('autoprefixer') ]) )
    .pipe( sourcemaps.write('.') )
    .pipe( gulp.dest('build/') )
})

Please refer this page: usage

Upvotes: 0

Armen Asaduryan
Armen Asaduryan

Reputation: 324

You can use something like this https://autoprefixer.github.io/

Upvotes: 1

Related Questions