@hidoo/gulp-task-build-css-sass
Task that build css by sass for gulp.
Last updated 8 months ago by hidoo .
MIT · Original npm · Tarball · package.json
$ cnpm install @hidoo/gulp-task-build-css-sass 
SYNC missed versions from official npm registry.

@hidoo/gulp-task-build-css-sass

Task that build css by sass for gulp.

Installation

$ npm install --save-dev gulp @hidoo/gulp-task-build-css-sass

Usage

basic:

import {task} from 'gulp';
import buildCss from '@hidoo/gulp-task-build-css-sass';

task('css', buildCss({
  src: '/path/to/scss/main.scss',
  dest: '/path/to/dest'
}));

remove unused CSS:

import {task} from 'gulp';
import buildCss from '@hidoo/gulp-task-build-css-scss';

task('css', buildCss({
  src: '/path/to/scss/main.scss',
  dest: '/path/to/dest',
  uncssTargets: ['/path/to/target.html']
}));

API

buildCss

return css build task by sass

Parameters

  • options Object options (optional, default {})
    • options.name String task name (use as displayName) (optional, default 'build:css')
    • options.src String source path
    • options.dest String destination path
    • options.filename String destination filename (optional, default 'main.css')
    • options.suffix String suffix when compressed (optional, default '.min')
    • options.browsers Array<String>? target browsers. see: default target browsers
    • options.banner String license comments (optional, default '')
    • options.sassOptions Object sass options. see: gulp-sass options (optional, default {outputStyle:'expanded'})
    • options.url String type of processing of url() (one of [inline|copy|rebase]) see: https://www.npmjs.com/package/postcss-url (optional, default null)
    • options.urlOptions Object options of processing of url() see: https://www.npmjs.com/package/postcss-url#options-combinations (optional, default {})
    • options.uncssTargets Array<String> array of html file path that target of uncss process (optional, default [])
    • options.uncssIgnore Array<String> array of selector that should not removed (optional, default [])
    • options.additionalProcess Function<PostCSSRoot> additional PostCss process (optional, default null)
    • options.compress Boolean compress file or not (optional, default false)

Examples

import {task} from 'gulp';
import buildCss from '@hidoo/gulp-task-build-css-sass';

task('css', buildCss({
  name: 'css:main',
  src: '/path/to/scss/main.scss',
  dest: '/path/to/dest',
  filename: 'styles.css',
  suffix: '.hoge',
  browsers: ['> 0.1% in JP'],
  banner: '/*! copyright <%= pkg.author %> * /\n',
  sassOptions: {outputStyle: 'nested'},
  url: 'inline',
  urlOptions: {basePath: path.resolve(process.cwd(), 'src/images')},
  uncssTargets: ['/path/to/html/target.html'],
  uncssIgnore: ['.ignore-selector'],
  additionalProcess: (root) => root,
  compress: true
}));

Returns Function<Stream>

Test

$ npm test

License

MIT

Current Tags

  • 0.15.0                                ...           latest (8 months ago)

7 Versions

  • 0.15.0                                ...           8 months ago
  • 0.14.1                                ...           a year ago
  • 0.14.0                                ...           a year ago
  • 0.13.0                                ...           a year ago
  • 0.12.0                                ...           a year ago
  • 0.11.0                                ...           a year ago
  • 0.10.0                                ...           a year ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 2
Last Day 0
Last Week 1
Last Month 1
Dependencies (16)
Dev Dependencies (12)
Dependents (0)
None

Copyright 2014 - 2017 © taobao.org |