I am trying to be a good boy and minify my css with gulp. I am currently using gulp-sass (not gulp-ruby-sass) and it does not seem to have inbuilt minifying. So now I am using gulp-minify-css to pipe some minifying into my compiling. The problem is that it now strips out all of my comments. both /*comment*/ and //comment. This is not ideal, as i need the initial comment to setup my wordpress theme.
So I looked in the documentation (https://github.com/jonathanepollack/gulp-minify-css/wiki), and it looks like there is an option for this called keepSpecialComments.
So I have tried the following in my gulpfile:
.pipe(minifycss({keepSpecialComments: '*'}))
and
.pipe(minifycss({keepSpecialComments: *}))
The first one still strips out the comments. the second one reports an error. So I think i might get the formatting wrong?
can anyone help me here?
Thanks
The second example you have there has the asterisk * sitting out in the open — it's not a string. That's why it reports an error.
The docs state that the default setting is to save all special comments. If you click through to clean-css, you will see that special comments refers to comments that have an exclamation mark (!) to note that they are important. Try changing your comment to look like this, and I bet it will retain it without any configuration at all.
/*!
put your settings here
*/
If Wordpress is incapable of working with the special comment, for some reason, then you can use gulp-replace to correct the comment before saving it, like this:
var replace = require('gulp-replace');
// ... sass, compress-css, etc ...
.pipe(replace('/*!', '/*'))
// ... gulp.dest, etc ...
This will remove the exclamation mark from the comment. I wouldn't bother doing this unless Wordpress fails.