Using Gulp I've got a pretty simple build process which presses everything into styles.min.css

gulp.task( 'styles', function() {
    gulp.src( './scss/*.scss' )
    .pipe( sass( { errLogToConsole: true } ) )
    .pipe( autoprefix( 'last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4' ) )
    .pipe( cssmin() )
    .pipe( rename( 'styles.min.css' ) )
    .pipe( gulp.dest( '../dist' ) );
});

Can I modify this to append a timestamp to the file name, so my browser knows this is a new file and to clear its cache?

Something like this:

styles—1423267988.min.css

Using Gulp I've got a pretty simple build process which presses everything into styles.min.css

gulp.task( 'styles', function() {
    gulp.src( './scss/*.scss' )
    .pipe( sass( { errLogToConsole: true } ) )
    .pipe( autoprefix( 'last 2 version', 'safari 5', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4' ) )
    .pipe( cssmin() )
    .pipe( rename( 'styles.min.css' ) )
    .pipe( gulp.dest( '../dist' ) );
});

Can I modify this to append a timestamp to the file name, so my browser knows this is a new file and to clear its cache?

Something like this:

styles—1423267988.min.css

• javascript
• css
• node.js
• gulp

• rename( 'styles.min.css' ) <-- so just put a timestamp here – zerkms Commented Feb 7, 2015 at 1:01
• @zerkms Is there a way to automate that? – Rich Commented Feb 7, 2015 at 1:14
• Yes, put a current timestamp there. There is a Date object in JS available. – zerkms Commented Feb 7, 2015 at 1:18
• 2 .pipe( rename( 'styles-'+((new Date()).getTime())+'.min.css' ) ) like so – David Parlevliet Commented Feb 7, 2015 at 2:17
• 1 I suggest posting an answer to your own question and marking it as accepted. – Timmerz Commented Feb 7, 2015 at 2:17

1 Answer 1

Follow-up:

Apparently, this is called cache-busting or fingerprinting

Using gulp-rev will append a hash to your output file.

...
    .pipe( rev() )
    .pipe( gulp.dest( '../dist' ) );
});