Hello,
From this document ( https://guides.emberjs.com/v2.14.0/addons-and-dependencies/managing-dependencies/ ) it show me to add external js, css and “compile” into a single file but how to add css in some page only?
For example: I have many css and js that is already imported into ember-cli-build.js and will be compiled to vendor.css, vendor.js.
Now I have jquery-ui.css which is too large to compile into a single vendor.css file. That jquery-ui.css will be use in few pages so it is no need to appears in vendor.css all the time.
How to add css in some page only?
broerse
September 5, 2017, 6:00am
2
Perhaps change the body class?
Inside a route called admin. Sorry for the confusion!
The route structure is
// Admin route that needs different class
this.resource('admin', function () {
// child routes
}
// standard route that can use the normal class
this.resource('orders', function () {
// child routes
}
Or if it is a page in an outlet add a
with a class around that page.
mupkoo
September 5, 2017, 9:07pm
3
You can use some of the model hooks (beforeModel, model, afterModel) to load a file from your public folder. For example:
beforeModel() {
let link = '<link href="jquery-ui.css" rel="stylesheet" id="jquery-ui-css" />';
if (!document.querySelector('#jquery-ui-css')) { // Already loaded?
document.getElementsByTagName("head")[0].appendChild(link);
}
}
1 Like
Try it both ways and benchmark it - it’s likely not an issue. jQuery UI and Ember feels like = Atari + Switch?