0

I had integrated sass suport in angular2 seed (https://github.com/mgechev/angular2-seed) and also installed susy form npm(npm install susy --save-dev) but when I imported susy form .scss file it gives following errors

[13:01:16] Starting 'build.html_scss'...
Error in plugin 'sass'
Message:
    src/client/css/main.scss
Error: File to import not found or unreadable: ~susy
       Parent style sheet: /home/jorin/WebStormWorkSpace/nylndaUI/src/client/css/main.scss
        on line 1 of src/client/css/main.scss
>> @import "~susy";
   ^

[13:01:16] Finished 'build.html_scss' after 218 ms

Anybody who can guide me, what I am doing wrong?

Jorin
  • 1,316
  • 1
  • 12
  • 16
  • Possible duplicate of [File to import not found or unreadable: susy](http://stackoverflow.com/questions/13022956/file-to-import-not-found-or-unreadable-susy) – Benson May 26 '16 at 07:28
  • You may need to install susy as a rub gem. See http://stackoverflow.com/questions/13022956/file-to-import-not-found-or-unreadable-susy – Benson May 26 '16 at 07:29
  • configuring susy to work with config.rb file and compass is working fine but I am trying to figure out how can I use susy with gulp based build system which uses gulp-sass to load susy(as i guess) and use the susy gird system in my project – Jorin May 26 '16 at 07:36

1 Answers1

3

In your sass, correct the path to susy.

It could be 

@import "~susy/sass/susy";

The Susy install Guide suggests to use bower and to use a relative path.

bower install susy --save
@import "../bower_components/susy/sass/susy";

But there's no reason you couldn't use the path to your npm-installed susy:

@import "../node_modules/susy/sass/susy";

If you're taking this method, this file is relative to your sass file, so it could be something like 

@import "../../../../node_modules/susy/sass/susy";
Benson
  • 4,181
  • 2
  • 26
  • 44