Closed youroff closed 8 years ago
Use a main file (eg app.scss
) and import other files (eg _mixins.scss
) using:
@import "mixins"
body {
// ...
}
That is exactly what I'm doing. Except that I don't underscore them. Does underscore prevents file from being compiled separately?
My problem, as far as I see, is that variables and mixins from bootstrap (imported in app.sass before other files) are not accessible inside of "other files", when they are rendered in isolation.
UPD: Ok, I tried and underscore seemed to prevent files from compiling separately, so this problem is gone
But the performance issue is still there and now, when I was able to compile all parts of my project it took 33 seconds. If I leave only bootstrap import in app.sass, it takes 10 seconds to render, which would be bearable if it was rendered once. But seems like it re-renders the whole set if something changed in other files. What I'm trying to figure out is whether it's considered normal or there's a problem with compass, sass or some other package.
I am aware that compilation is slow however I have no good solution for that for now. I hope someone with deeper knowledge of compass, sass cache and broccoli will tackle that and submit a PR.
Sorry, forgot to answer earlier. The problem as I discovered is that compass
uses ruby sass
, when ember-cli-sass
relies on node-sass
which uses libsass
written in C. So it's much faster. Probably the only way to achieve the same speed of compilation is to try to keep using ember-cli-sass
with only importing sass sources of Compass. Not sure if this approach allows for using of all the features of Compass, though.
What you said should be doable with ember-cli-sass. This repo uses compass as the name suggests. If a faster compass solution becomes available, I will switch to that.
I'm trying to make compass and bootstrap work together and it seems like it takes >20 seconds to compile just plain bootstrap:
What would be normal compilation time?
Besides that, I observe errors that weren't there before (when I used ember-cli-sass):
I tried to launch this command and it only shows
>
as if it was expecting some input. Compass version is1.0.3
.UPD: Seems like it renders separate CSS files, is there some setting to tell it building one file? UPD2: Probably the key is here:
Other .scss files in app/styles are compiled as well.
What's the workflow for splitting styles into importable pieces then?