CODEWITHSUNDEEP
node.jssassgulpgulp-sass
Steve
Steve

Reputation: 14922

Gulp-sass not finding variable in included files(s)?

I have a _variables.scss file where a map is declared:

$chord1: (
  color1: rgb(0, 155, 223), 
  color2: rgb(114, 191, 68), 
  color3: rgb(207, 9, 137), 
  color4: rgb(62, 83, 164)
);

$chord: $chord1;

I have a second file. _globals.scss where I reference this:

.myClass { color: map-get($chord, color1); }

I have a the main scss file as app.scss, which @imports them:

@import 'colors';
@import 'globals';

However, gulp-sass throws an error Error: invalid top-level expression based on that map-get.

I was using gulp-ruby-sass on one project and it worked. However, in this project we are using gulp-sass 1.1.0. My gulp task is:

gulp.task('styles', function () {
   return gulp.src('./app/assets/sass/app.scss')
   .pipe(plumber())
   .pipe(sass({ style: 'expanded' }))
   .pipe(gulp.dest('./app/assets/css'))
   .pipe(reload({stream: true}));
});

Does this sort of thing just not work in gulp-sass? Or am I doing something wrong?

Upvotes: 2

Views: 1188

Answers (1)

Heikki
Heikki

Reputation: 15417

Half guess: Imports work fine but node-sass doesn't support maps that came with Sass 3.3.

https://github.com/sass/node-sass#reporting-sass-compilation-and-syntax-issues

The libsass library is not currently at feature parity with the 3.2 Ruby Gem that most Sass users will use, and has little-to-no support for 3.3 syntax. While we try our best to maintain feature parity with libsass, we can not enable features that have not been implemented in libsass yet.

Upvotes: 2

Related Questions