@nickkaramoff/taskr-sass

Compile SASS with Dart Sass and Taskr

Usage no npm install needed!

<script type="module">
  import nickkaramoffTaskrSass from 'https://cdn.skypack.dev/@nickkaramoff/taskr-sass';
</script>

README

@nickkaramoff/taskr-sass npm

Compile SASS with sass and Taskr.

Heads up!

This is a fork of the official @taskr/sass package with a few differences:

  • this package uses sass (aka Dart Sass) instead of node-sass
  • this package supports Node version 8.9.0 and higher (like Dart Sass itself)

While this can be used as a drop-in replacement for @taskr/sass, there is no guarantee that your build won't break. Use with caution!

Install

$ npm install --save-dev @nickkaramoff/taskr-sass

Usage

The paths within task.source() should always point to files that you want transformed into .css files.

Basic

exports.styles = function * (task) {
  yield task.source('src/styles/style.scss').sass().target('dist');
}

Multiple Bundles

Simply create an array of individual file paths.

exports.styles = function * (task) {
  yield task.source([
    'src/styles/client.scss',
    'src/styles/admin.scss'
  ]).sass().target('dist');
}

SASS vs SCSS

There is no need to set indentedSyntax -- the SASS parser will intelligently decipher if you are using the SASS syntax.

exports.styles = function * (task) {
  yield task.source([
    'src/styles/client.sass', // SASS
    'src/styles/admin.scss' // SCSS
  ]).sass().target('dist');
}

Sourcemaps

You may create source maps for your bundles. Simply provide the desired file path as outFile or sourceMap.

Important: It is recommended that you provide sourceMap your desired path. However, if sourceMap is true, you must then provide outFile your file path string.

exports.styles = function * (task) {
  yield task.source('src/app.sass')
    .sass({ sourceMap:'dist/css/app.css.map' })
    .target('dist');
}

// OR

exports.styles = function * (task) {
  yield task.source('src/app.sass')
    .sass({ sourceMap:true, outFile:'dist/css/app.css.map' })
    .target('dist');
}

API

.sass(options)

This plugin does not have any custom options. Please visit sass JS API for a full list of available options.

Note: You will not be able to set the file or data options. These are done for you & cannot be changed.

Support

Any issues or questions about Taskr can be sent to the Taskr monorepo.

Any issues about this package should be sent here.

License

MIT © Luke Edwards MIT © Nikita Karamov