@rbnlffl/gulp-sass

@rbnlffl/gulp-sass

Lightweight gulp wrapper around sass. 🏄🏼‍♂️

How

npm i -D @rbnlffl/gulp-sass sass

const { src, dest } = require('gulp');
const sass = require('@rbnlffl/gulp-sass');

const css = () => src('source/css/*.scss')
  .pipe(sass())
  .pipe(dest('public/css'));

module.exports.css = css;

Config

The plugin takes an options object and passes it directly to sass. You can see a full documentation of what props are available here. Mind you that directly manipulating options regarding the file input and sourcemaps output is strongly discouraged, as this gets handled by the plugin itself. Below you'll find the most common options.

includePaths

Type: string[]
Default: undefined

Tells sass where it can look for files to import from. A popular use case would be node_modules.

outputStyle

Type: string
Default: 'expanded'

Controls the output style of the emitted CSS chunks. Valid options are 'expanded' and 'compressed'.

indentType

Type: string
Default: 'space'

Whether to use a space or a tab character to use for indentation. Used together with indentWidth.

indentWidth

Type: number
Default: 2

How many space or tab characters should be used per indentation level.

Why a new plugin?

Because gulp-sass uses node-sass under the hood, which in turn relies on node-gyp and needs to be built every fresh install. This is prone to leading to compile errors on newer versions of macOS. See here, for example.

License

MIT

Changelog

v0.2.3

2024-05-01

• loosen gulp peer dependency
• convert to esm