Should my Gulp inline sourcemap file size be as large as it is?

Question

I'm including Bootstrap in my Sass styles. When I compile the Sass without sourcemaps enabled the file size is approx. 150kb. When I turn sourcemaps on the file size shoots up to 800kb. Is this to be expected? Eventually I will be cherry-picking the parts of Bootstrap I need but for now it seems like a lot.

Here's my Sass task:

gulp.task('sass', function() {
    return sass(config.sassPath, {
        style: 'compressed',
        loadPath: ['./node_modules/bootstrap-sass/assets/stylesheets'],
        sourcemap: true
    })
    .on('error', function (err) {
        console.log('Error!', err.message);
    })
    .pipe( autoprefix('last 2 versions') )
    // .pipe( sourcemaps.init() )
    .pipe( sourcemaps.write() )
    .pipe( gulp.dest('./public/css') )
    .pipe( reload( {stream: true} ) )
    .pipe( notify('Sass compiled') );
});

Answer 1

You can either write the sourcemaps on external files, e.g. .pipe( sourcemaps.write('./SOURCEMAPS_DIRNAME') ) or have your production CSS minified and without the sourcemaps.