Getting incorrect path with sourcemaps, am I doing something wrong?

I’m very new to this package, so it’s quite possible I’m doing something wrong or that it isn’t a gulp-sass issue. Any help, or a nudge in the right direction, is greatly appreciated. 😃

That said:

I’m using gulp-sass with bootstrap-sass. I’m starting with a simple SCSS file, vendor.scss:

@import "../../../node_modules/bootstrap-sass/assets/stylesheets/_bootstrap.scss";
@import "custom.scss";

My custom.scss:

body {
    background-color: pink;
}

And my gulp task:

gulp.task('css:vendor', function() {
    return gulp.src('./client/features/shared/vendor.scss')
        .pipe(sourcemaps.init())
        .pipe(sass({ outputStyle: 'compressed', sourceComments: 'map' }))
        .pipe(sourcemaps.write('.'))
        .pipe(gulp.dest('./dist'));
});

Everything builds, the resulting CSS is what I would expect, but the sourcemap is off for the style from my custom.scss. It seems to be “stuck” on the last file that was processed from bootstrap’s package:

Any tips or suggestions?

[zephster]

Have you tried using outputStyle: 'compact' instead of compressed? I have the same issue when I use compressed, but changing it to compact fixes it. I haven’t found a proper solution for this issue, because I would prefer to use compressed.

[JoshMoreno]

@Dellkan @MattHoneycutt I think I spoke too soon. I don’t think it’s a problem with gulp-sass anymore. I still had postcss running autoprefixer in the stream. When I commented that out and just ran gulp-sass with sourcemaps and outputStyle: 'compressed' it’s working fine.

So it seems like the problem is postcss or autoprefixer. Will update as I find out more. The bootstrap breadcrumbs issue still holds true though as it messes up libsass itself.