Ember import bootstrap theme installed with bower

Question

This is my first project with Ember.js and I'm following this tutorial as starting point to my project. I was asking myself what are the best practices to apply a bootstrap theme.

I am currently using Bootstrap-Sass "3.3.6" and the theme I want to use is https://github.com/puikinsh/gentelella and I installed it through bower.

bower install gentelella --save

If I get it right I must import this file in my ember-cli-build.js file with app.import command like this:

app.import('bower_components/gentelella/build/css/custom.min.css')

Yet no difference in my html documents can be seen. Neither in my network section.

I think that maybe I should add to my style.scss file an import statement, but I don't know where should I make it point to...

So, how do you import a bootstrap theme? Anyone can give some help?

check this http://stackoverflow.com/questions/23349959/recommended-way-to-include-bootstrap-library-in-ember-js-ember-cli-app?rq=1 — prudvi raju, Jun 09 '16 at 17:41
So I suppose the app.import is the way to go http://stackoverflow.com/a/27094027/593963 — Simone Poggi, Jun 09 '16 at 18:19

score 0 · Accepted Answer · answered Jun 18 '16 at 11:02

According to the official documentation, the correct way to import a vendor file into your project is through ember-cli-build.js, specifying the file you need to have with an app.import.

https://guides.emberjs.com/v2.0.0/addons-and-dependencies/managing-dependencies/

The reason I didn't see any difference in my network section is because Ember generates a vendor.css and vendor.js files that contains all the imported files. If you inspect them you can see all the stuff properly imported.

Ember import bootstrap theme installed with bower

1 Answers1