Menu icon Foundation

Designer | Austria

I am a hobbyist coder/designer of small websites, mostly for private purposes. I like to work with the dajngo framework and use Foundation to quickly get my sites running without having to tinker with the design and having them still look good and functional.

My Posts

  • 3
    Replies
  • SASS "Recommended Install" errors

    By Peter W

    Sass

    I tried foundation a few month ago and finally gave up on the recommended install for the sass version. Foundation is a neat way to prototype so I decided to try and give it a whirl again. After three frustrating hours followoing the steps of the recom... (continued)

    Last Reply by jessica ndaye over 4 years ago




My Comments

Peter W commented on Juhana's post about 5 years

@Rafi: Do I understand this right, that bower has been ditched in favor of bundler?
If so, you may want to update the documentation of the install process where it still asks to install bower.

@JoRoe: I haven't tried it yet but a

 sudo apt-get install bundler

may fix your problem.

Peter W commented on Peter W's post about 5 years

Well I've got it running now. I did not, however upgrade to compass 1.1.0. In my opinion it had nothing to do with the problem. As I explained over at http://foundation.zurb.com/forum/posts/19139-foundation-sass-installation-process it seems there was a bit of version mangling going on. The short version: The different versions of Sass and Foundation depend on each other so changing one without the other does NOT solve the problem. Even doing so failed until recently due to some weird version mismatch.

So what I did was (do NOT do this quite yet, read til the end, maybe you will come back to this, should everything else fail) to download the foundation-master.zip and copied the foundation scss branch into the bower-components directory. As soon as I did this, it worked. Yeah! But why?

I won't explain it again, as you can read up at the above link. Anyway, the problem seems to be solved now. (You may want to try this. I do not give the actual shell commands as those may be different on a Windows machine.)

  1. I deleted the bower-components directory of my project
  2. I ran bower cache clear
  3. I ran bower uninstall foundation (this may have been redundant, but I try to go through every step I took).
  4. I made sure I had 'zurb/bower-foundation" in my topmost bower.json file for the foundation version.
  5. I ran bower update
  6. I ran bower install foundation.
  7. I ran 'compass compile' (you may want to try 'compass watch')

It worked and compiled correctly, index.html looked like it should.

Now my twopence to the why:
Sass 3.4.3 needs Foundation 5.4.3 to work.
5.4.3 was regardless what bower has told you (until appearantly fixed a short while ago) actually 5.4.2.
So it did not work.
I may have had the wrong 5.4.3 in my bower cache, though I do not actually know why, I've never had 5.4.2 installed).

But there is more:
libsass does not support Sass 3.4, only 3.2. So you may want to downgrade, if you do not use compass. Use the path Giuseppe sketched out.
Furthermore Sass 3.4.3 does not work with Foundation < 5.4.3. You need to upgrade both.

I hope this helps, it cost me some hours for the last days to figure it out.

Peter W commented on Peter W's post about 5 years

I've elaborated a bit on the thread with my original question. http://foundation.zurb.com/forum/posts/19076-recommended-install-for-foundation

Meanwhile I did a bit more digging around and ran a diff on both foundation/scss directories.

According to the bower json in foundation-master.zip this is version 5.4.3.
According to the bower json which was downloaded with bower update, this is version 5.4.2.
According to the .bower json (mind the period!) which was downloaded with bower update, this is version 5.4.3.

This is rather strange... as the bower update messages tell me:

bower cached        git://github.com/zurb/bower-foundation.git#5.4.3
bower validate      5.4.3 against git://github.com/zurb/bower-foundation.git#*
bower new           version for git://github.com/zurb/bower-foundation.git#*
bower resolve       git://github.com/zurb/bower-foundation.git#*
bower download      https://github.com/zurb/bower-foundation/archive/5.4.3.tar.gz
bower extract       foundation#* archive.tar.gz
bower invalid-meta  foundation is missing "ignore" entry in bower.json
bower resolved      git://github.com/zurb/bower-foundation.git#5.4.3

(It does not matter if I specify 5.4.3 explicitly or use zurb/bower-foundation in my projects bower.json. It even happens if I create a brand new project.)

The diff shows (amongst various other changes) an interesting thing in _functions.scss which has been mentioned in other posts:

(from bower update)

@if (index($modules, $name) == false) {
    $modules: append($modules, $name);
    @content;
}

vs (from foundation-master.zip)

@if(not index($modules, $name)) {
    $modules: append($modules, $name) !global;
    @content;
}

So it is 5.4.2 after all!
Copying _functions.scss from foundation_master.zip to the bower repo actually resolves the problem and it does compile correctly.

The remaining question is: Why does bower update (or install) resolve to 5.4.3 but install 5.4.2?

Peter W commented on Peter W's post about 5 years

@James:
I used:

 sudo gem install compass --version 1.1.0

I've got the compass gem V 1.0.1 (Polaris) installed. The result of a previous run of

sudo gem install compass

I installed ruby from my packet-manager:

sudo apt-get install ruby

It is v1.9.3p484.

I've got no antivirus installed.

Though the site rubygems.org works fine in my browser, it resolves to 54.186.104.15 but does not return pings. tracepath terminates with no reply after 16 hops (somewhere behind amazons cloud border). curl rubygems.org works just fine.

Meanwhile I've installed manually from foundation-master.zip 5.4.3 (ditching the foundation CLI, git, bower, node.js, npm, libsass and grunt) and everthing works flawlessly. The jQuery-namespace problem does not occur and the app.css ist generated completely. I've tested with sass (3.4.0 and 3.4.3) and both worked, as well as with compass 1.0.1. It works too.

So my best guess is that something is broken in the convoluted installation process. Which is really strange as I've kept my initial directory from the recommended install trying to run compass and sass directly on it. In both cases the app.css is not generated with all necessary styles (no error message given) and on loading the page the jQuery error is still there and needs the namespace fix. Foundation is 5.4.3. So you see my a bit nonplussed.
And yes, I've checked permissions. Twice. Really.

Peter W commented on Peter W's post about 5 years

Thank you for your answer.

I did download the master.zip you suggested, extracted it into a new directory, added jquery and modernizr to the js directory, whipped up a barely modified app.scss, _settings.scss, config.rb and index.html (to reflect changed paths), ran

 compass compile

(because I happen to have it installed anyways now)

and was good to go in under 5 minutes. No namespace bug, no compile problems, no fuss. This is what I was expecting in the first place. Maybe you should feature this installation course a bit more prominently.

Again, thank you for your answer.

Peter W commented on Peter W's post about 5 years

@Guiseppe: Thank you very much for your effort.

Unfortunately, for me it fails at the very first step:

 ERROR:  Could not find a valid gem 'compass' (= 1.1.0) in any repository

Peter W commented on Peter W's post about 5 years

I'm sorry to say this, but I am finally giving up, having spent way too much time trying to get this to work. I really wanted this to pan out. But if I'd stuck with the static version, I'd probably been quicker making all the changes manually.

There was a reply here this morning suggesting a compatibility issue of foundation 5 and the Sass version I am using. Which is strange, as I did no custom installation at all and used the recommended install path exclusively. There also were some some diffs but before I could try them out, the post was deleted.

Strangely enough, there now is a warning in the installation guide for the libsass version (which I am not using) concerning sass 3.4. The link there hints at a solution by altering the code but actually leads to a closed discussion thread with no information on how to get this to work.

As it is, I am very sorry to say that Foundation 5 with Sass is a hassle to set up, buggy, finally not usable and a rather frustrating experience. This saddens me because I do know how much time and effort goes into such (free!) projects and I understand how frustrating it is if such things do not work out with the intended audience.

I still appreciate the time you invest in this forum and try to help out as well as in the Foundation framework, which is really great. Thank you.

Peter W commented on Peter W's post about 5 years

Thank you for your answers. Just to make this clear: I am developing on a Linux box running Kubuntu LTS 14.04.

@Rafi: I am running Sass 3.4.3 (Selective Steve).

The index.html of the newly created project looks just fine if I add the static foundation.min.css in the header manually, but I guess that kind of defeats the purpose of using Sass in the first place.

Posts Followed

  • 19
    Replies
  • Sass 3.4.2 compilation problem

    By Semafork

    Sassscss

    Hi, Since I upgraded my sass to 3.4.2, under linux via gem, my foundation compilation is incomplete. No error message, but the css file result doesn't contain all components. I've read the changelog http://sass-lang.com/documentation/file.SASS_CHANGEL... (continued)

    Last Reply by john wan almost 2 years ago


  • 1
    Reply
  • Problem with scss

    By Matt Dean

    scssFoundation

    I have set up foundation with SCSS, it all looks ok, but when I run compass watch, only settings is getting created in my css. I have import foundation at the top but no foundation css is being brought in. Does this need a relative link (as it is in ... (continued)

    Last Reply by Rafi Benkual about 5 years ago



Following

    No Content

Followers

My Posts



My Comments

You commented on Juhana's post about 5 years

@Rafi: Do I understand this right, that bower has been ditched in favor of bundler?
If so, you may want to update the documentation of the install process where it still asks to install bower.

@JoRoe: I haven't tried it yet but a

 sudo apt-get install bundler

may fix your problem.

You commented on Peter W's post about 5 years

Well I've got it running now. I did not, however upgrade to compass 1.1.0. In my opinion it had nothing to do with the problem. As I explained over at http://foundation.zurb.com/forum/posts/19139-foundation-sass-installation-process it seems there was a bit of version mangling going on. The short version: The different versions of Sass and Foundation depend on each other so changing one without the other does NOT solve the problem. Even doing so failed until recently due to some weird version mismatch.

So what I did was (do NOT do this quite yet, read til the end, maybe you will come back to this, should everything else fail) to download the foundation-master.zip and copied the foundation scss branch into the bower-components directory. As soon as I did this, it worked. Yeah! But why?

I won't explain it again, as you can read up at the above link. Anyway, the problem seems to be solved now. (You may want to try this. I do not give the actual shell commands as those may be different on a Windows machine.)

  1. I deleted the bower-components directory of my project
  2. I ran bower cache clear
  3. I ran bower uninstall foundation (this may have been redundant, but I try to go through every step I took).
  4. I made sure I had 'zurb/bower-foundation" in my topmost bower.json file for the foundation version.
  5. I ran bower update
  6. I ran bower install foundation.
  7. I ran 'compass compile' (you may want to try 'compass watch')

It worked and compiled correctly, index.html looked like it should.

Now my twopence to the why:
Sass 3.4.3 needs Foundation 5.4.3 to work.
5.4.3 was regardless what bower has told you (until appearantly fixed a short while ago) actually 5.4.2.
So it did not work.
I may have had the wrong 5.4.3 in my bower cache, though I do not actually know why, I've never had 5.4.2 installed).

But there is more:
libsass does not support Sass 3.4, only 3.2. So you may want to downgrade, if you do not use compass. Use the path Giuseppe sketched out.
Furthermore Sass 3.4.3 does not work with Foundation < 5.4.3. You need to upgrade both.

I hope this helps, it cost me some hours for the last days to figure it out.

You commented on Peter W's post about 5 years

I've elaborated a bit on the thread with my original question. http://foundation.zurb.com/forum/posts/19076-recommended-install-for-foundation

Meanwhile I did a bit more digging around and ran a diff on both foundation/scss directories.

According to the bower json in foundation-master.zip this is version 5.4.3.
According to the bower json which was downloaded with bower update, this is version 5.4.2.
According to the .bower json (mind the period!) which was downloaded with bower update, this is version 5.4.3.

This is rather strange... as the bower update messages tell me:

bower cached        git://github.com/zurb/bower-foundation.git#5.4.3
bower validate      5.4.3 against git://github.com/zurb/bower-foundation.git#*
bower new           version for git://github.com/zurb/bower-foundation.git#*
bower resolve       git://github.com/zurb/bower-foundation.git#*
bower download      https://github.com/zurb/bower-foundation/archive/5.4.3.tar.gz
bower extract       foundation#* archive.tar.gz
bower invalid-meta  foundation is missing "ignore" entry in bower.json
bower resolved      git://github.com/zurb/bower-foundation.git#5.4.3

(It does not matter if I specify 5.4.3 explicitly or use zurb/bower-foundation in my projects bower.json. It even happens if I create a brand new project.)

The diff shows (amongst various other changes) an interesting thing in _functions.scss which has been mentioned in other posts:

(from bower update)

@if (index($modules, $name) == false) {
    $modules: append($modules, $name);
    @content;
}

vs (from foundation-master.zip)

@if(not index($modules, $name)) {
    $modules: append($modules, $name) !global;
    @content;
}

So it is 5.4.2 after all!
Copying _functions.scss from foundation_master.zip to the bower repo actually resolves the problem and it does compile correctly.

The remaining question is: Why does bower update (or install) resolve to 5.4.3 but install 5.4.2?

You commented on Peter W's post about 5 years

@James:
I used:

 sudo gem install compass --version 1.1.0

I've got the compass gem V 1.0.1 (Polaris) installed. The result of a previous run of

sudo gem install compass

I installed ruby from my packet-manager:

sudo apt-get install ruby

It is v1.9.3p484.

I've got no antivirus installed.

Though the site rubygems.org works fine in my browser, it resolves to 54.186.104.15 but does not return pings. tracepath terminates with no reply after 16 hops (somewhere behind amazons cloud border). curl rubygems.org works just fine.

Meanwhile I've installed manually from foundation-master.zip 5.4.3 (ditching the foundation CLI, git, bower, node.js, npm, libsass and grunt) and everthing works flawlessly. The jQuery-namespace problem does not occur and the app.css ist generated completely. I've tested with sass (3.4.0 and 3.4.3) and both worked, as well as with compass 1.0.1. It works too.

So my best guess is that something is broken in the convoluted installation process. Which is really strange as I've kept my initial directory from the recommended install trying to run compass and sass directly on it. In both cases the app.css is not generated with all necessary styles (no error message given) and on loading the page the jQuery error is still there and needs the namespace fix. Foundation is 5.4.3. So you see my a bit nonplussed.
And yes, I've checked permissions. Twice. Really.

You commented on Peter W's post about 5 years

Thank you for your answer.

I did download the master.zip you suggested, extracted it into a new directory, added jquery and modernizr to the js directory, whipped up a barely modified app.scss, _settings.scss, config.rb and index.html (to reflect changed paths), ran

 compass compile

(because I happen to have it installed anyways now)

and was good to go in under 5 minutes. No namespace bug, no compile problems, no fuss. This is what I was expecting in the first place. Maybe you should feature this installation course a bit more prominently.

Again, thank you for your answer.

You commented on Peter W's post about 5 years

@Guiseppe: Thank you very much for your effort.

Unfortunately, for me it fails at the very first step:

 ERROR:  Could not find a valid gem 'compass' (= 1.1.0) in any repository

You commented on Peter W's post about 5 years

I'm sorry to say this, but I am finally giving up, having spent way too much time trying to get this to work. I really wanted this to pan out. But if I'd stuck with the static version, I'd probably been quicker making all the changes manually.

There was a reply here this morning suggesting a compatibility issue of foundation 5 and the Sass version I am using. Which is strange, as I did no custom installation at all and used the recommended install path exclusively. There also were some some diffs but before I could try them out, the post was deleted.

Strangely enough, there now is a warning in the installation guide for the libsass version (which I am not using) concerning sass 3.4. The link there hints at a solution by altering the code but actually leads to a closed discussion thread with no information on how to get this to work.

As it is, I am very sorry to say that Foundation 5 with Sass is a hassle to set up, buggy, finally not usable and a rather frustrating experience. This saddens me because I do know how much time and effort goes into such (free!) projects and I understand how frustrating it is if such things do not work out with the intended audience.

I still appreciate the time you invest in this forum and try to help out as well as in the Foundation framework, which is really great. Thank you.

You commented on Peter W's post about 5 years

Thank you for your answers. Just to make this clear: I am developing on a Linux box running Kubuntu LTS 14.04.

@Rafi: I am running Sass 3.4.3 (Selective Steve).

The index.html of the newly created project looks just fine if I add the static foundation.min.css in the header manually, but I guess that kind of defeats the purpose of using Sass in the first place.

Posts Followed




Following

  • No Content

Followers

  • No Content