UNPKG

rump-styles

Version:

Rump piece for building CSS

95 lines (75 loc) 5.19 kB
# Rump Styles [![NPM](http://img.shields.io/npm/v/rump-styles.svg?style=flat-square)](https://www.npmjs.org/package/rump-styles) ![License](http://img.shields.io/npm/l/rump-styles.svg?style=flat-square) [![Issues](https://img.shields.io/github/issues/rumps/issues.svg?style=flat-square)](https://github.com/rumps/issues/issues) ## Status ### Master [![Dependencies](http://img.shields.io/david/rumps/styles.svg?style=flat-square)](https://david-dm.org/rumps/styles) [![Dev Dependencies](http://img.shields.io/david/dev/rumps/styles.svg?style=flat-square)](https://david-dm.org/rumps/styles#info=devDependencies) <br> [![Travis](http://img.shields.io/travis/rumps/styles.svg?style=flat-square&label=travis)](https://travis-ci.org/rumps/styles) [![Appveyor](http://img.shields.io/appveyor/ci/jupl/rump-styles.svg?style=flat-square&label=appveyor)](https://ci.appveyor.com/project/jupl/rump-styles) [![Codecov](http://img.shields.io/codecov/c/github/rumps/styles.svg?style=flat-square&label=codecov)](https://codecov.io/github/rumps/styles?view=all) ### Develop [![Dependencies](http://img.shields.io/david/rumps/styles/develop.svg?style=flat-square)](https://david-dm.org/rumps/styles/develop) [![Dev Dependencies](http://img.shields.io/david/dev/rumps/styles/develop.svg?style=flat-square)](https://david-dm.org/rumps/styles/develop#info=devDependencies) <br> [![Travis](http://img.shields.io/travis/rumps/styles/develop.svg?style=flat-square&label=travis)](https://travis-ci.org/rumps/styles) [![Appveyor](http://img.shields.io/appveyor/ci/jupl/rump-styles/develop.svg?style=flat-square&label=appveyor)](https://ci.appveyor.com/project/jupl/rump-styles) [![Codecov](http://img.shields.io/codecov/c/github/rumps/styles/develop.svg?style=flat-square&label=codecov)](https://codecov.io/github/rumps/styles?branch=develop&view=all) ## About Rump Styles is a Rump module for styles authored in CSS, LESS, Sass, and Stylus with [Pleeease](http://pleeease.io/) included to write better CSS with ease and even leverage some future CSS features. For more information, visit the [core repository](https://github.com/rumps/core). ## API The following is appended to the core Rump API: ### `rump.addGulpTasks(options)` This module adds the following tasks: - `build:styles` will process CSS stylesheets with Pleeease. For more information on source and destination paths see `rump.configure()` below. This task is also added to the `build` task. - `watch:styles` will run `build:styles`, then monitor for changes and process updated files as needed. This task is also added to the `watch` task. - `info:styles` will display information on what this specific module does, specifically the source and destination paths as well as what files would get processed. This task is also added to the `info` task. ### `rump.configure(options)` Redefine options for Rump and Rump modules to follow. In addition to what options Rump and other Rump modules offer, the following options are available alongside default values: #### `options.paths.source.styles` (`'styles'`) This is the directory where styles to be processed are contained. This path is relative to the root source path. (If the default root and styles path is used, then the path would be `src/styles`) #### `options.paths.destination.styles` (`'styles'`) This is the directory where styles are copied to. This path is relative to the root destination path. (If the default root and styles path is used, then the path would be `dist/styles`) #### `options.globs.build.styles` (`'*.{css,less,scss,styl}`) This specifies which stylesheets to process. By default it processes all CSS files in the immediate directory of the root source path for styles. #### `options.globs.watch.styles` (`'**/*.{css,less,scss,styl}`) This specifies which stylesheets to monitor for changes. By default it watches all CSS files in the root source path for styles, including those in subdirectories. #### `options.styles.minify` (`options.environment === 'production'`) This specifies whether to minify generated CSS. (minified if `true`) By default CSS is minified only if the environment is set to production. (visit the main Rump repository for more information on environment) #### `options.styles.sourceMap` (`options.environment === 'development'`) This specifies whether to include inline source maps to generated CSS. (source maps included if `true`) By default source maps are included only if the environment is set to development. (visit the main Rump repository for more information on environment) #### `options.styles.pleeease` This specifies any options you want to override in Pleeease. (specifically [gulp-pleeease](https://github.com/danielhusar/gulp-pleeease)) Minification by default is enabled or disabled based on the minify option above. Future CSS features are enabled by default. Default search paths for `@import` are also added, including: `node_modules`, `bower_components`, and root source path for styles detailed above. ### `rump.configs.pleeease` This contains the generated options that are passed to Pleeease in the Gulp task. This is a good way to see what options are generated based on defaults and overrides.