jarvis.css

Gulp task for compiling css

Usage no npm install needed!

<script type="module">
  import jarvisCss from 'https://cdn.skypack.dev/jarvis.css';
</script>

README

jarvis-css

Extremely fast gulp task for compiling sass, scss, less, stylus to css. Easy config, and use.

NPM

Installation

npm i --save-dev jarvis.css

Usage

I tried to do usage of this task as simple as posible. The following example will compile all the *.build.{less,sass,scss,stylus} files under the folder config.input to destination folder config.output

const css = require('./src/index');
const gulp = require('gulp')

const cssConf = {output: 'test/dist', input: 'test/src', processor: 'less'}
gulp.task('css:build', css.build(cssConf))
gulp.task('css:watch', ['css:build'], css.watch(cssConf))

API

The API of the package has two methods:

css.build(options) - Run task with given config

var defaultConfig = {
    input: `src/css/`, // input folder, only strings alowed
    output: 'dist/css/', // output folder, only strings alowed
    development: true, // set false for minifing and disable sourcemaps
    processor: 'less', // less|sass|stylus
    plugins: {
        'autoprefixer': {browsers: '> 1%', remove: false}, //gulp-autoprefixer config
        'clean-css': undefined, //gulp-clean-css config
        'less': {paths: ['bower_components', 'node_modules']}, //gulp-less config
        'sass': {includePaths: ['bower_components', 'node_modules']}, //gulp-sass config
        'stylus': undefined //gulp-stylus config
    }
};

css.watch(options) - Run watcher for all preprocessors file extensions, under input folder.

var defaultConfig = {
    input: `src/css/`, // input folder, only strings alowed
    output: 'dist/css/', // output folder, only strings alowed
    development: true, // set false for minifing and disable sourcemaps
    processor: 'less', // less|sass|stylus
    plugins: {
        'autoprefixer': {browsers: '> 1%', remove: false}, //gulp-autoprefixer config
        'clean-css': undefined, //gulp-clean-css config
        'less': {paths: ['bower_components', 'node_modules']}, //gulp-less config
        'sass': {includePaths: ['bower_components', 'node_modules']}, //gulp-sass config
        'stylus': undefined //gulp-stylus config
    }
};