gulp-compass icon indicating copy to clipboard operation
gulp-compass copied to clipboard

Source map comment not being added to CSS file

Open bodhiprice opened this issue 9 years ago • 2 comments

I'm using version 2.0.4 and the issue I'm seeing is that the comment with the path to the source map isn't being added to the generated CSS file. For example:

/*# sourceMappingURL=main.css.map */

That bit isn't being added to the CSS file and so when I'm in DevTools, I don't see the mapping. When I add that bit manually, all is well. Any ideas what might be happening here?

bodhiprice avatar Apr 24 '15 19:04 bodhiprice

I came across the same problem but it seems to be gulp-autoprefixer removing the comments.

You can either remove autoprefixer for the development build or get gulp-sourcemaps to create the sourcemaps rather than compass:

gulpfile.js:

var sourcemaps = require('gulp-sourcemaps');
var autoprefixer = require('gulp-autoprefixer');
var compass = require('gulp-compass');

gulp.task('css:dev', function(){
  gulp.src('./scss/**/*.scss')
    .pipe(sourcemaps.init())
    .pipe(compass({
      config_file: './config.rb',
      environment: 'development',
      sass: 'scss',
      css: 'css'
    }))
    .pipe(sourcemaps.write({includeContent: false}))
    .pipe(sourcemaps.init({loadMaps: true}))
    .pipe(autoprefixer({browsers: ['last 2 versions']}))
    .pipe(sourcemaps.write('.'))
    .pipe(gulp.dest('css'));
});

I got the above fix from here.

markhorgan avatar Sep 17 '15 09:09 markhorgan

@markhorgan Thanks for the tip!

bodhiprice avatar Sep 17 '15 16:09 bodhiprice