I am new to Sage, and with the latest version checked out from Github I am experiencing an issue with the Gulp processing of the SASS files.
The dist/main.css built with the gulp command has the CSS on the same line as a comment, rendering all of the CSS ineffective.
Here is the example:
/*!
* Bootstrap v3.3.5 (http://getbootstrap.com)
* Copyright 2011-2015 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*//*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;....
The following steps reproduce this; I’ve tried several times now with the same results.
git clone https://github.com/roots/sage.git
npm cache clean
npm install
bower install
gulp
At this point the dist/main.css file is as I showed above.
I was able to resolve this issue by adding:
keepSpecialComments: 0
To line 113 of the gulpfile.js
A solution I found on the forum here: Gulp minifyCss and CSS Special Comments which also points to the culprit being the “/*!” from the _bootstrap.scss included as a part of Sage.
Please let me know if I am doing something wrong, or if this is an issue with Sage.
Thank you,
Nicholas