How to a include Stylus Libraries with grunt-contrib-stylus?

Question

I would like to add Jeet & Rupture to my stylus setup.

I have run npm install --save-dev rupture & npm install --save-dev jeet

But I am not sure on how to have them used by the stylus setup, this is what I have:

// Compiles Stylus to CSS
    stylus: {
      server: {
        options: {
          paths: [
            '<%= yeoman.client %>/bower_components',
            '<%= yeoman.client %>/app',
            '<%= yeoman.client %>/components',
            '<%= yeoman.client %>/assets'
          ],
          "include css": true
        },
        files: {
          '.tmp/app/app.css' : '<%= yeoman.client %>/app/app.styl'
        }
      }
    },

And this is how I am calling Jeet.

@import 'jeet';

But I get this error failed to locate @import file jeet.styl

>>     6| @import 'jeet';
>> --------------^

I have managed to get autoprefixer-stylus working using `use: [ function() { return require('autoprefixer-stylus')('last 2 versions', 'ie 8'); } ],` form here https://gist.github.com/sapegin/6987625 But I still can't figure out how to get jeet and rupture working. — Daimz, Nov 07 '14 at 07:52

score 1 · Answer 1 · edited Apr 07 '15 at 02:59

For those that are interested I have found a solution:

stylus: {
      server: {
        options: {
          use: [
            require('jeet'),
            require('rupture'),
            function() { return require('autoprefixer-stylus')('last 2 versions', 'ie 8'); }
          ],
          paths: [
            './node_modules/rupture',
            './node_modules/jeet/stylus',
            '<%= yeoman.client %>/bower_components',
            '<%= yeoman.client %>/app',
            '<%= yeoman.client %>/components',
            '<%= yeoman.client %>/assets'
          ],
          // "include css": true,
          // use: jeet()
        },
        files: {
          '.tmp/app/app.css' : '<%= yeoman.client %>/app/app.styl'
        }
      }
    },

Is this assuming that they are installed via npm instead of bower or something else? — Mike Lyons, Apr 07 '15 at 02:26

score 1 · Answer 2 · edited Apr 07 '15 at 02:49

1

An alternative solution would be to include a full path to the library, eg.

@import '/bower_components/jeet/stylus/jeet'

You can do this for all your required libraries.

edited Apr 07 '15 at 02:49

Mike Lyons

1,748
2
20
33

answered Jan 30 '15 at 19:18

user2033464

143
1
10

How to a include Stylus Libraries with grunt-contrib-stylus?

2 Answers2