I’ve been trying to figure this out, and I need some help.
I want to use a custom version of bootstrap and I want to use SASS. The thing is, I want to compile bootstrap to vendor.css (and not to my app.css file). This is because I have a bunch of plugins that I depend on bootstrap’s CSS, so if I add the
@import statement to my
app/styles.scss bootstrap’s styles will go to the
app-name.css file, and all the styles of the plugins won’t work (because they are on the
vendor.css which is before the
app.css). I also have a bootstrap theme that provides a SASS version that I would like to place right after bootstrap.
So I have an ember-cli-build.js file somewhat like this:
//SASS files app.import('path/to/bootstrap/_bootstrap.scss'); <---- I would like this to work somehow app.import('path/to/template/styles.scss'); <---- I would like this to work somehow //Plugins app.import('bower_components/datatables/media/css/jquery.dataTables.css'); app.import('bower_components/datatables/media/css/dataTables.bootstrap.css'); app.import('vendor/css/plugins/toastr/toastr.min.css');
I don’t want to include all the plugins in my app.css file because most of the plugins (and even bootstrap and the theme) don’t change much, there’s no point in making them part of the app.css.
I’ve tried fiddling with ember-cli-build and adding broccoli plugins but without much luck.