2

I'm running gulp to compile my sass files. The problem I'm running into is I'm only seeing one scss file when inspecting an element. If you need further information let me know.

I'm running node v0.12.2 My setup below:

SCSS Structure

src/scss/main.scss - imports various partials

Dev Dependecies

gulp": "^3.8.11",

gulp-sass": "^1.3.3",

gulp-sourcemaps": "^1.5.2"

Gulp File

gulp.task('sass', function (){
     gulp.src('src/scss/**/*.scss')
    .pipe(sourcemaps.init())
    .pipe(sass())
    .pipe(sourcemaps.write('./'))
    .pipe(gulp.dest('build/css'));
});

gulp.task('default', function(){
    gulp.start('sass');
});

Source Map

{"version":3,"sources":["includes/_buttons.scss","includes/_layout.scss","includes/_reset.scss"],"names":[],"mappings":"AAAA,AACC,AAAY,AACZ,AAAQ,AACR,AAAO,AACP,AAAQ,AAGT,AACC,AAAY,AACZ,AAAQ,AACR,AAAO,AACP,AAAQ,ACXT,AACC,AAAY,ACDb,AACC,AAAQ,AACR,AAAS","file":"main.css","sourcesContent":[".btn {\r\n\tbackground: #555;\r\n\tborder: 1px solid #999;\r\n\twidth: 100px;\r\n\theight: 50px;\r\n}\r\n\r\n.btn-large {\r\n\tbackground: #555;\r\n\tborder: 1px solid #999;\r\n\twidth: 200px;\r\n\theight: 100px;\r\n}","body {\r\n\tbackground: #333;\r\n}","* {\r\n\tmargin: 0;\r\n\tpadding: 0;\r\n}"],"sourceRoot":"/source/"}

anthony w
  • 41
  • 2

1 Answers1

0

I was seeing the same issue until I upgraded to gulp-sass@2.0.0. I'm seeing an incorrect mapping now in my project, but it resolved the single-file issue talked about here. See the related github issue on the gulp-sourcemaps repository.

coderroggie
  • 870
  • 12
  • 25