How to import in Meteor app .styl files other files from npm package bootstrap-styl?


#1

I am using Meteor 1.4.2.1 with atmosphere package stylus@2.513.7 and npm module bootstrap stylus 3.3.7 installed by doing meteor npm install bootstrap-styl.

I am trying to build a variant of the Meteor leaderboard example in which I import only the two bootstrap classes that I use, namely tables and buttons (together with some of their specializations) instead of the whole of bootstrap by adding the big bad atmosphere package twbs:bootstrap@3.3.6. This is in the hope that it will make the Meteor generated /.meteor/local/build/programs/web.server/app/app.js file lighter and faster to load.

In my /client/ui/player/player.styl file I have the import statement:

@import '{}/node_modules/boostrap-styl/bootstrap/buttons.styl'

which make the stylus compiler generates the error:

`1| @import ‘{}/node_modules/boostrap-styl/bootstrap/buttons.styl’
--------------^

failed to locate @import file
{}/node_modules/boostrap-styl/bootstrap/buttons.styl`

However, the buttons.styl file is precisely under that path in the node_modules folder.

I have tried using a relative path for the import:

@import '../../node_modules/boostrap-styl/bootstrap/buttons.styl'

but the stylus compiler gives me the same error.

What I am doing wrong?

In addition, there are also two other button files in the bootstrap-styl module:
/node_modules/bootstrap-styl/boostrap/mixins/buttons.styl
/node_modules/bootstrap-styl/js/button.js

and I am not sure whether I need to import them as well, and if I do need to import the button.js file, in which file of my app should the import statement be added?


Thoughts on using jade with Meteor?