scotch / angular-brunch-seed

AngularJS + Brunch
Other
228 stars 78 forks source link

how to use SASS #106

Closed abbood closed 10 years ago

abbood commented 10 years ago

so i basically added this dependency in package.json "sass-brunch": "~1.7.0",

however when I included .sass files under /app/styles.. I got this error message:

25 May 10:47:12 - error: Compiling of 'app/styles/main.css.sass' failed. Syntax error: File to import not found or unreadable: properties.
              Load paths:
                /Users/abdullah/dev/js/sandbox/angular-brunch-seed
                /Users/abdullah/dev/js/sandbox/angular-brunch-seed
                /Users/abdullah/dev/js/sandbox/angular-brunch-seed/app/styles
                /Users/abdullah/dev/js/sandbox/angular-brunch-seed/sass
                /Users/abdullah/.rvm/gems/ruby-1.9.3-p545/gems/compass-0.12.6/frameworks/blueprint/stylesheets
                /Users/abdullah/.rvm/gems/ruby-1.9.3-p545/gems/compass-0.12.6/frameworks/compass/stylesheets
                Compass::SpriteImporter
        on line 1 of standard input
  Use --trace for backtrace.
 ; Compiling of 'app/styles/scaffolds.css.sass' failed. Syntax error: File to import not found or unreadable: properties.
              Load paths:
                /Users/abdullah/dev/js/sandbox/angular-brunch-seed
                /Users/abdullah/dev/js/sandbox/angular-brunch-seed
                /Users/abdullah/dev/js/sandbox/angular-brunch-seed/app/styles
                /Users/abdullah/dev/js/sandbox/angular-brunch-seed/sass
                /Users/abdullah/.rvm/gems/ruby-1.9.3-p545/gems/compass-0.12.6/frameworks/blueprint/stylesheets
                /Users/abdullah/.rvm/gems/ruby-1.9.3-p545/gems/compass-0.12.6/frameworks/compass/stylesheets
                Compass::SpriteImporter
        on line 1 of standard input
  Use --trace for backtrace.
 ; Compiling of 'app/styles/slider.css.sass' failed. Syntax error: File to import not found or unreadable: properties.
              Load paths:
                /Users/abdullah/dev/js/sandbox/angular-brunch-seed
                /Users/abdullah/dev/js/sandbox/angular-brunch-seed
                /Users/abdullah/dev/js/sandbox/angular-brunch-seed/app/styles
                /Users/abdullah/dev/js/sandbox/angular-brunch-seed/sass
                /Users/abdullah/.rvm/gems/ruby-1.9.3-p545/gems/compass-0.12.6/frameworks/blueprint/stylesheets
                /Users/abdullah/.rvm/gems/ruby-1.9.3-p545/gems/compass-0.12.6/frameworks/compass/stylesheets
                Compass::SpriteImporter
        on line 1 of standard input
  Use --trace for backtrace.

any idea how to fix this?

kylefinley commented 10 years ago

Hey @abbood,

The issue appears to be with an import. I would try removing imports until it works, then changing just one import. You might experiment with relative imports, and also using an import path that uses the root directory. I'm not sure how the SASS compiler works, but here's what absolute imports look like in LESS. https://github.com/scotch/angular-brunch-seed/blob/master/app/styles/app.less#L12 And relative: https://github.com/scotch/angular-brunch-seed/blob/master/app/styles/app.less#L103

I hope that helps. If not, leave this issue open so hopefully someone more knowledgeable about the SASS compiler will comment.

abbood commented 10 years ago

it worked man thanks!