1 | #gulp-stylus
|
2 | [![Build Status](https://travis-ci.org/stevelacy/gulp-stylus.png?branch=master)](https://travis-ci.org/stevelacy/gulp-stylus)
|
3 | [![NPM version](https://badge.fury.io/js/gulp-stylus.png)](http://badge.fury.io/js/gulp-stylus)
|
4 |
|
5 | > Compile [Stylus](http://learnboost.github.io/stylus/) with gulp (gulpjs.com)
|
6 |
|
7 | ## Information
|
8 |
|
9 | <table>
|
10 | <tr>
|
11 | <td>Package</td><td>gulp-stylus</td>
|
12 | </tr>
|
13 | <tr>
|
14 | <td>Description</td>
|
15 | <td>Stylus plugin for gulp</td>
|
16 | </tr>
|
17 | <tr>
|
18 | <td>Node Version</td>
|
19 | <td>>= 0.9</td>
|
20 | </tr>
|
21 | <tr>
|
22 | <td>Gulp Version</td>
|
23 | <td>3.x</td>
|
24 | </tr>
|
25 | </table>
|
26 |
|
27 | ## Usage
|
28 |
|
29 | #### Install
|
30 |
|
31 | ```sh
|
32 | $ npm install --save-dev gulp-stylus
|
33 | ```
|
34 |
|
35 | ## Examples
|
36 |
|
37 | ```javascript
|
38 |
|
39 | // include the required packages.
|
40 | var gulp = require('gulp');
|
41 | var stylus = require('gulp-stylus');
|
42 |
|
43 | // include, if you're going to use nib helper library
|
44 | var nib = require('nib');
|
45 |
|
46 | // include, if you want to work with sourcemaps
|
47 | var sourcemaps = require('gulp-sourcemaps');
|
48 |
|
49 | // Get one .styl file and render
|
50 | gulp.task('one', function () {
|
51 | gulp.src('./css/one.styl')
|
52 | .pipe(stylus())
|
53 | .pipe(gulp.dest('./css/build'));
|
54 | });
|
55 |
|
56 | // Options
|
57 | // Options compress
|
58 | gulp.task('compress', function () {
|
59 | gulp.src('./css/compressed.styl')
|
60 | .pipe(stylus({
|
61 | use: nib(),
|
62 | compress: true
|
63 | }))
|
64 | .pipe(gulp.dest('./css/build'));
|
65 | });
|
66 |
|
67 | // Use nib
|
68 | gulp.task('nib', function () {
|
69 | gulp.src('./css/nib.styl')
|
70 | .pipe(stylus({use: [nib()]}))
|
71 | .pipe(gulp.dest('./css/build'));
|
72 | });
|
73 |
|
74 | // Set linenos
|
75 | gulp.task('linenos', function () {
|
76 | gulp.src('./css/linenos.styl')
|
77 | .pipe(stylus({linenos: true}))
|
78 | .pipe(gulp.dest('./css/build'));
|
79 | });
|
80 |
|
81 | // Inline sourcemaps
|
82 | gulp.task('sourcemaps-inline', function () {
|
83 | gulp.src('./css/sourcemaps-inline.styl')
|
84 | .pipe(sourcemaps.init())
|
85 | .pipe(stylus())
|
86 | .pipe(sourcemaps.write())
|
87 | .pipe(gulp.dest('./css/build'));
|
88 | });
|
89 |
|
90 | // External sourcemaps
|
91 | gulp.task('sourcemaps-external', function () {
|
92 | gulp.src('./css/sourcemaps-external.styl')
|
93 | .pipe(sourcemaps.init())
|
94 | .pipe(stylus())
|
95 | .pipe(sourcemaps.write('.'))
|
96 | .pipe(gulp.dest('./css/build'));
|
97 | });
|
98 |
|
99 | // Default gulp task to run
|
100 | gulp.task('default', ['one', 'compress', 'nib', 'linenos', 'sourcemaps-inline', 'sourcemaps-external']);
|
101 |
|
102 | ```
|
103 |
|
104 | #####You can view more examples in the [example folder.](https://github.com/stevelacy/gulp-stylus/tree/master/examples)
|
105 |
|
106 | ## Options
|
107 | #### All stylus options are passed to [accord/stylus](https://github.com/jenius/accord/blob/master/docs/stylus.md)
|
108 |
|
109 |
|
110 |
|
111 | ## LICENSE [MIT](LICENSE)
|