Koala7 Koala7 - 19 days ago 10
Sass (Sass) Question

Ember-Cli SASS Settings

I am using

ember-cli-sass
instead of
broccoli-ruby-sass


These are the steps i have done

npm install --save-dev ember-cli-sass

bower install --save foundation


I am getting this error in the console after i started the
ember server


enter image description here

I don't understand why it says "File not found: /app/styles/app.scss"

i don't have any app.scss a part from

enter image description here

I am missing something in the configuration, what's the problem exactly?

I am using three sass file

_global.sass
_music.sass
_player.sass


i import them in app.sass

@import global
@import player
@import music


i was reading the https://www.npmjs.com/package/ember-cli-sass and it says

Specify some include paths in config/environment.js:

ENV.sassOptions = {
includePaths: [
'bower_components/foundation/scss'
]
}


I am bit confused about these settings, i need some advices

Answer

I think you are getting the error because you may not have changed the name of your app.css file to app.scss

You your app/styles folder you should have a file called app.scss in that file I would put your imports

// app.scss
   @import 'foundation';
   @import 'global';
   @import 'player';
   @import 'music';

Then you need to add:

ENV.sassOptions = {
  includePaths: [
    'bower_components/foundation/scss'
  ]
}

To your config/environment.js like this:

module.exports = function(environment) {
  var ENV = {
    modulePrefix: 'test-sass',
    environment: environment,
    baseURL: '/',
    locationType: 'auto',
    sassOptions: {
      includePaths: [
        'bower_components/foundation/scss'
      ]
    },
    EmberENV: {
      FEATURES: {
   .....

If you are looking to use foundation in your ember-cli app use the ember-cli addon: https://www.npmjs.com/package/ember-cli-foundation-sass