How to concatenate CSS files into a single file using steal-tools

StealJS
1

What is the correct way to concatenate multiple css files into a single css file using steal-tools.

Example: I have this following CSS files on different node packages that i want to concatenate and save into vendors.css

node_modules/bootstrap/dist/css/bootstrap.css
node_modules/font-awesom/css/font-awesome.css

when concatenated it will be save into this directory

assets/css/vendors.css

I cannot seems to understand the documentation of steal-tools on how to do it. Please enlighten me on this. Thanks

2

hello @kankuro,

with stealjs you can require LESS within javascript files / modules.

just create a js-file vendor.js

require('vendor.less');

in vendor.less you can write this:

@import 'locate://bootstrap/dist/css/bootstrap.css';
@import 'locate://font-awesome/css/font-awesome.css';

if you are using steal 1.0 do not forget to set the plugins http://stealjs.com/docs/npm.html#packagestealplugins

dont tested this, pls comment if this is not working

Note: the @import statement only works in the first level of less files. you can’t use @import in e.g. bootstrap.css

3

Hi @pYr0x,

Thanks a lot for this, I will try what you’ve suggest and I will let you know if it will work or not. Once again thanks a lot its a big help.

1 Like