Sass Gulp Corrupted

Question

We have gulp running sass and browser sync, and had been running without problems for about 6 months. We have about 60 sass and scss filed being compiled on the fly into CSS.

Everything was going fine and smooth and then suddenly the front end compiler starts throwing millions of errors - as though somebody went into 75% of the sass files and added semi-colons, removed spaces, moved spaces around, and there's an error in the _media.scss file that I don't understand.

How could this happen all of a sudden just like that? I have no idea what to do now - I've spent around 45 minutes just trying to solve all of the errors but there are so many.

Answer 1

Since this problem I've learned that when gulp-sass crashes it is probably because of a Sass or Scss syntax error caused by incorrect indentation or something similar. It is probably not caused by Gulp or Sass or Gulp-Sass or another js plugin being corrupted.

What a revelation.

This was not obvious to me as because I normally get sass syntax errors printed to the console and I assumed this would happen on all sass errors, but this error it seems was bit more destructive because it fed into a sass loop.

The only way to find the error to disable all sass files one by one until sass-gulp stops crashing. Then debug the faulty file.

It helps debugging if you break your sass/sass files and up into really small files and folders and include them with @import. Then you can comment out @import lines easily, to find the file with the error.

In-case you have this problem and you definitely have no Sass errors (unlikely)-

Here is a random list of stuff I was ready to try that I found here https://github.com/sass/node-sass/issues/918 :

1.Initially I thought I fixed it by un-installing and reinstalling gulp-sass.

2. Completely deleting the node_modules directory and doing a fresh npm install
3. Doing a npm uninstall of gulp and gulp-sass, then a fresh npm install
4. Doing a global install of node-sass, and doing a global uninstall of node-sass.
5. Doing a npm rebuild node-sass from within the node_modules/gulp-sass directory
6. Doing a npm install with node-sass@2, then node-sass@3 when that didn't work
7. Banging my head repeatedly against my desk