gulp-css-scss

Gulp plugin for converting CSS to Scss, uses the css-scss module created by @jxnblk.

Installation

npm install --save gulp-css-scss

Usage

const gulp = require('gulp');
const cssScss = require('gulp-css-scss');
 
gulp.task('css-scss', () => {
  return gulp.src('my-file.css')
    .pipe(cssScss())
    .pipe(gulp.dest('scss'));
});
 
gulp.task('default', ['css-scss']);

Input

:root {
  --red: #f00;
}
 
.warning {
  color: var(--red):
}
 
@media (--breakpoint-small) {
  .sm-col-6 { width: 50% }
}
 
@custom-media --breakpoint-small (min-width: 40em);
 
.col-4 { calc( 4 / 12 * 100% ) }

Output

$red: #f00 !default;
 
.warning {
  color: $red;
}
 
$breakpoint-small: '(min-width: 40em)' !default;
 
@media #{$breakpoint-small} {
  .sm-col-6 { width: 50% }
}
 
.col-4 { ( 4 / 12 * 100% ) }

License

MIT

Related

• https://github.com/jxnblk/css-scss

Contributing

1. Fork it
2. Create your feature branch (git checkout -b my-new-feature)
3. Commit your changes (git commit -am 'Add some feature')
4. Push to the branch (git push origin my-new-feature)
5. Create new Pull Request

Crafted with <3 by John Otander (@4lpine).

---

This package was initially generated with yeoman and the p generator.