node.jsember.jssasslibsass

ember-cli-scss compile error with SASS Lists and Maps


Given a ember-cli application with the ember-cli-scss addon and following SCSS Code containing a map:

$mdb-color: (
  "lighten-5":  #D0D6E2,
  "lighten-4":  #B1BACE,
  "lighten-3":  #929FBA,
  "lighten-2":  #7283A7,
  "lighten-1":  #59698D,
  "base":       #45526E,
  "darken-1":   #3B465E,
  "darken-2":   #2E3951,
  "darken-3":   #1C2A48,
  "darken-4":   #1C2331,
);

the compiler throws the error Error: ("lighten-5": #fafafa, ...) isn't a valid CSS value.

Changing the node-sass version to 3.13.0 via adding node-sass to the package.json and passing node-sass to the app config:

var nodeSass = require('node-sass');

var app = new EmberApp(defaults, {
    sassOptions: {
        nodeSass: nodeSass
    }
});

The error still occurs.

I'm sure that the node-sass version 3.13.0 will be used by ember-cli-scss with that configuration.

node-sass 3.13.0 uses libsass 3.3.6. Maps are supported since 3.1.

Is there something else to do in order to fix that issue?


Solution

  • Seems like the error message was somewhat misleading. The actual issue was that libsass couldn't compile MDBootstraps at all, the maps actually worked. However I'm note sure how to fix that.