Prevent minified version of source maps?

How do I prevent this plug-in from compiling a minified version of the source map? Example:

This is what I have in my gulpfile for this task:

// Compile Our Sass
gulp.task('sass', function() {
    return gulp.src('*.scss')
        .pipe(sourcemaps.init())
        .pipe(sass(sassOptions).on('error', sass.logError))
        .pipe(autoprefixer())
        .pipe(gulpIf('*.css', minifyCss()))
        .pipe(rename({
            suffix: '.min'
        }))
        .pipe(sourcemaps.write('./'))
        .pipe(gulp.dest('./'));
});

If I just do: .pipe(minifyCss()) it doesn’t create a .min version of oneweb.css, it just creates compressed/minified css in that file. 😦

[anzorb]

@jaminroe this should do it for you. This clones the source, allowing you to get to the source stream BEFORE it became the sourcemap.

var $ = require('gulp-load-plugins')();
var gulp = require('gulp');
var merge = require('merge-stream');

gulp.task('sass', function() {
    var source = gulp.src('./src/scss/index.scss')
        .pipe($.sourcemaps.init())
        // compile sass into css
        .pipe($.sass({ includePaths: './src' }).on('error', $.sass.logError))
        // autoprefix css
        .pipe($.autoprefixer(autoprefixerOptions));

    var compile = source
        .pipe($.clone())
        .pipe($.rename(packageName + '.css'))
        .pipe(gulp.dest(outputDir))
        .pipe($.sourcemaps.write('.'))
        .pipe(gulp.dest(outputDir));

    var minify = source
        .pipe($.clone())
        .pipe($.rename(packageName + '.min.css'))
        // minify
        .pipe($.cssnano())
        .pipe(gulp.dest(outputDir))

    return merge(compile, minify);
});

BTW, if you’re deploying code to production, and want to log what kind of errors your customers/users are getting (with a tool like Sentry/Raven for examples), sourcemaps of minified code will show you the real error and not a cryptic minified file one. They’re actually very useful.

[jonhurrell]

Hello. I may be able to offer some advice on this issue. FYI gulp-minify-css is deprecated, advising to use gulp-cssnano. I got around the minifying of sourcemaps by using gulp-ignore and excluding the map pattern before running nano:

gulp.task('styles', function() {

    var outputDirectory = publicDirectory + 'css/';

    return gulp.src(config.files.styles)
        .pipe(plumber({errorHandler: errorAlert}))
        .pipe(sourcemaps.init())
        .pipe(scsslint({
            'config': '.scss-lint.yml'
        }))
        .pipe(sass({
            style : 'expanded',
            includePaths: [config.files.nodeModules]
        }))
        .pipe(autoprefixer('last 2 versions'))
        .pipe(sourcemaps.write(config.files.stylesMap))
        .pipe(gulp.dest(outputDirectory))
        .pipe(ignore.exclude('*.map'))
        .pipe(rename({ suffix : '.min' }))
        .pipe(nano())
        .pipe(gulp.dest(outputDirectory))

});