Menu icon Foundation
gulp sass recompile not working in realtime

Ok this is a strange one. I just installed F6 CLI and made a new test site. Everything worked with no errors and I have the 'sample' Foundation for Sites welcome page up and the css is applied correctly after running 'foundation watch' in the project dir.

Here's the issue. I added a partial scss file called _custom.scss and added the import line to app.scss. I added a simple css element to set background color like this

#mydiv {

background-color: #fff600;

}

I opened the main site dir and ran 'foundation watch' refreshed page and mydiv has a yellow background as it should. However, when I go back into the scss file and change the color, even though the foundation watch gulp sass process recognizes the saved change (at 15:39:03), it is not reflected in the page. (I have cleared browser cache and reloaded). It either shows no color or worse...all css formatting is gone. I also tried starting it with npm start instead of foundation watch but it looks like they are one in the same as the error occurs either way.

[15:39:03] Starting 'sass'...
[15:39:04] Finished 'sass' after 1.24 s

The only way that I can make the change appear, is to kill the foundation watch with Ctrl+C and start foundation watch again. I shouldn't have to do this. Using compass watch with F5 always compiled instantly on any save and showed any errors in scss.

Any clues?

watchgulpscssnpm

Ok this is a strange one. I just installed F6 CLI and made a new test site. Everything worked with no errors and I have the 'sample' Foundation for Sites welcome page up and the css is applied correctly after running 'foundation watch' in the project dir.

Here's the issue. I added a partial scss file called _custom.scss and added the import line to app.scss. I added a simple css element to set background color like this

#mydiv {

background-color: #fff600;

}

I opened the main site dir and ran 'foundation watch' refreshed page and mydiv has a yellow background as it should. However, when I go back into the scss file and change the color, even though the foundation watch gulp sass process recognizes the saved change (at 15:39:03), it is not reflected in the page. (I have cleared browser cache and reloaded). It either shows no color or worse...all css formatting is gone. I also tried starting it with npm start instead of foundation watch but it looks like they are one in the same as the error occurs either way.

[15:39:03] Starting 'sass'...
[15:39:04] Finished 'sass' after 1.24 s

The only way that I can make the change appear, is to kill the foundation watch with Ctrl+C and start foundation watch again. I shouldn't have to do this. Using compass watch with F5 always compiled instantly on any save and showed any errors in scss.

Any clues?