Angular 2 seed - how to enable compass support in sass file

Question

I use this seed project for my Angular 2 app.

My goal is to use compass mixins and functions in all sass files.

In this moment when i try to use @import 'compass' it simply can not make import.

I had instaled newest SASS and COMPASS gem.

I think to do this i need some config.rb but i have no idea how to properly place it in this files structure.

Or maybe i need gulp-compass and implement some gulp's task to enable compass, when whole app build-up?

But when exactly start this task and how should code for this task look like ?

this has nothing to do with angular at all – smnbbrv Apr 05 '16 at 15:35 — smnbbrv, Apr 05 '16 at 15:35
It is becouse it is used inside angular 2 seed project. – MichalObi Apr 05 '16 at 18:03 — MichalObi, Apr 05 '16 at 18:03

score 0 · Answer 1 · answered Apr 20 '16 at 09:40

If you want to use compass mixin only, it is better to use compass-mixins. It contains most compass mixins as 'original Compass' provided.

Here are the steps:

npm install --save-dev compass-mixins
Edit SASS options in seed.config.ts

SASS_OPTIONS: SassOptions = { includePaths: ['./node_modules/compass-mixins/lib/'] };

Then it should work in angular2-seed-sass. Because I did similar thing in angular2-seed and it works.

After play with gulp-compass, gulp-ruby-sass for 2 days, I believe that the above solution should be the simplest.

1 Answers1