Compass Compiling Issue

[angsmith]

I took an exact replica of this website (using BackupBuddy) & installed it locally to start working on via MAMP. It looked completely fine when I first ran it locally.

As soon as I run 'compass watch' though, something breaks, resulting in the local site looking like this:

I know this is almost impossible for you to debug without seeing a live version, but is there anything obvious from this that could be causing the issue? It seems that the default Foundation's CSS (for the top bar, components etc) are not being loaded.

[angsmith]

I've looked further to compare the 2 sites and it seems that app.scss is just not being compiled properly locally. On the remote (correct) version, this file has 6589 lines. However, locally, this file has 806 lines and I see that there are no styles for the grid columns etc.

[jamzth]

What exactly is the difference between the app.scss of the local and remote? Correct the difference and compile. The scss files are the files being compiled, so I'm a little confused how the origin files aren't the main issue. Once you get all the scss files right and compile, it'll be all good. Maybe I'm misunderstanding?

Grace and Peace,

James Hammack

On Sep 3, 2015, at 02:09, angelasmith [email protected] wrote:

I've looked further to compare the 2 sites and it seems that app.scss is just not being compiled properly locally. On the remote (correct) version, this file has 6589 lines. However, locally, this file has 806 lines and I see that there are no styles for the grid columns etc.

—
Reply to this email directly or view it on GitHub.

[GarySwift]

I'm having the exact same issue. I have created several live sites using reverie and many test sites without issue.

However, 'compass watch' is now now compiling the scss incorrectly. Two of my local sites look like the second screenshot above. The only way I get them looking correct is by FTPing into remote site and getting the old css files.

Anyone got any ideas on this?

[angsmith]

I think it has something to do with bower. Basically, the core foundation SCSS (located in bower_components) are not being compiled. Is there something in particular that we could be missing? We shouldn't have to touch the foundation core files.

[GarySwift]

At @angsmith, yes, at first I suspected the foundation files inside bower_components could be corrupted so deleted everything from there and and ran bower install instead. This still didn't resolve the issue.

But you are correct, we shouldn't have to touch anything inside bower_components as it is outside version control.

[GarySwift]

OK, this issue seems to be resolved for me now. I didn't do anything to fix it but 'compass watch' is is now compiling my sass correctly.

I'm going to proceed with caution and sync the remote css as I go. I will comment back here if this issue occurs again.

[catchlightWeb]

I'm having the same issue and it should be easy enough to replicate for anyone.
Wordpress 3.4.1, Reverie 5.0.0

A Diff between the original Reverie style.css and the processed CSS after I do my first "compass watch" reveals the following.
The original has about 178 lines of css code that starts off...

meta.foundation-version {
  font-family: "/5.2.3/";
}

meta.foundation-mq-small {
  font-family: "/only screen/";
  width: 0em;
}
etc
etc

After processing this is replaced by the 436 lines of css that starts off ...

   /* small displays */
@media only screen {
  .show-for-small-only, .show-for-small-up, .show-for-small, .show-for-small-down, .hide-for-medium-only, .hide-for-medium-up, .hide-for-medium, .show-for-medium-down, .hide-for-large-only, .hide-for-large-up, .hide-for-large, .show-for-large-down, .hide-for-xlarge-only, .hide-for-xlarge-up, .hide-for-xlarge, .show-for-xlarge-down, .hide-for-xxlarge-only, .hide-for-xxlarge-up, .hide-for-xxlarge, .show-for-xxlarge-down {
    display: inherit !important;
  }

Any ideas?

[angsmith]

Have you tried reinstalling bower / running bower install & bower update ?

This seemed to solve the issue for me.

[catchlightWeb]

Thanks Ang Smith, that seems to have fixed things. :)