Menu icon Foundation
Problem Setting up Grunt + Libsass with foundation cli

Hello All,

I'm a complete noob at this so bear with me. I've decided to take the plunge and learn how to work with Foundation SASS. I'm a novice with an intermediate knowledge of HTML5 and CSS who enjoys building websites for fun, mostly for family and friends and I'm always willing to put in the time, effort and energy to learn something new. That said...

I've just installed Ruby1.9.3, nodejs, npm, bower, git, grunt and foundation cli as outlined in http://foundation.zurb.com/docs/sass.html and I'm pretty sure everythng is fine as they all installed with only a small problem or two related to the enviornment path which were easily resolved. Keep in mind that I have no idea what any of these packages do except for the small amount I've read to get them installed.

My issue begins when I try to install Foundation in a newly created webroot folder for a new project using foundation cli.

I navigated into the directory where I want to create my project. I created 2 files, gruntfile.js and package.json. I type "foundation new project_name --libsass" [Enter} and receive the following error: Foundation command is not recognized as an internal or external command, operable program or batch file.

I'm stumped. It looks like another path issue but when I created foundation cli, no path variable was created. I added one but still get the same error. I'm going to guess that my gruntfile.js and package.json will also be a problem but I can't get past the unrecognized command issue to figure it out.

Finally, I'm using Windows 7 (yeah I know) and the good ol' DOS prompt.

Any help or insight will be greatly appreciated.

Tom

scssGruntlibsassfoundation cli

Hello All,

I'm a complete noob at this so bear with me. I've decided to take the plunge and learn how to work with Foundation SASS. I'm a novice with an intermediate knowledge of HTML5 and CSS who enjoys building websites for fun, mostly for family and friends and I'm always willing to put in the time, effort and energy to learn something new. That said...

I've just installed Ruby1.9.3, nodejs, npm, bower, git, grunt and foundation cli as outlined in http://foundation.zurb.com/docs/sass.html and I'm pretty sure everythng is fine as they all installed with only a small problem or two related to the enviornment path which were easily resolved. Keep in mind that I have no idea what any of these packages do except for the small amount I've read to get them installed.

My issue begins when I try to install Foundation in a newly created webroot folder for a new project using foundation cli.

I navigated into the directory where I want to create my project. I created 2 files, gruntfile.js and package.json. I type "foundation new project_name --libsass" [Enter} and receive the following error: Foundation command is not recognized as an internal or external command, operable program or batch file.

I'm stumped. It looks like another path issue but when I created foundation cli, no path variable was created. I added one but still get the same error. I'm going to guess that my gruntfile.js and package.json will also be a problem but I can't get past the unrecognized command issue to figure it out.

Finally, I'm using Windows 7 (yeah I know) and the good ol' DOS prompt.

Any help or insight will be greatly appreciated.

Tom

Steve Trask over 5 years ago

Hi Tom,

Please stick with it! Double check you haave done all the steps might be worth a read of a post I did for personal reference http://www.designedbyasaint.co.uk/foundation-5/install-foundation-5

and making sure you have run the 'gem install foundation'

Let us know how you get on

Steve

Tom Hogan over 5 years ago

Hi Steve,

Thanks for your link.

I created a folder called DevTools and underneath I installed the following: Bower, Foundation, Git, Grunt, Nodejs, and Ruby193. In addition I have a folder for npm at \users\Me\AppData\Roaming\npm

I use a program called WampDeveloper that is similar to xamp that provides an Apache server, php, MySQL, etc. I'm trying to install foundation 5 and Libsass in ..\WampDeveloper\websites\MyFirstSassProject\webroot. Inside \webroot I placed 2 files package.json and gruntfile.js that I found on github\foundation.

When I type "foundation new MyFirstSassProject --libsass", I get the error described above. I know that the command "foundation" isn't being recognized but why? is my foundation cli in the wrong directory? or do I need an environment path statement to a specific file within \Devtools\foundation? Inquiring minds want to know! :)

Tony Stark over 5 years ago

HII
I never try with libsass, but you can try by yeoman generator
https://www.npmjs.org/package/generator-zf5

Steve Trask over 5 years ago

Hi Tom,

I am away from my setup at the moment to confirm file location etc as i want to get this sorted as I know how frustrating it can be! Where you say you placed 2 files in your web root from github - you do not need to do this it all comes down from the new project command. So if I need a new website project called mysite in a folder called websites I would

navigate to the websites folder via gitbash (or whichever cmd line tool you like)

foundation new mysite --libsass

This will create the folder mysite for you with the relevant files. this may not have anything to do with it but worth a go. I will check on locations soon as back at my desk

Hope this helps

Steve

Steve Trask over 5 years ago

Hi Tom,

Sorry forgot to add, I also use WAMP fror certain projects but this does not affect Foundation you can just run the cmd in the folder where Wamp looks at for the localhost.

Tom Hogan over 5 years ago

Steve,

Thanks for the effort.

It is frustrating! I just can't figure out why the "foundation new" command isn't being recognized. As you state, I navigate to where I want the files to be copied, run the command, then get the "Foundation command is not recognized as an internal or external command..." error. It really shouldn't matter where I run the command from unless Foundation cli needs to be pointed in some way. Again, I'm a Windows user so commands like bash and sudo don't apply.

I placed the gruntfile.js and package.json files in the directory where I run the command from because I thought they were needed to add additional tools to the project like uglify, watch, etc.

My guess is that it's something simple so I'll keep plugging away. I didn't come this far to accept defeat.

Here's my gruntfile.js and package.json code which I copied right from Foundation figuring if it works for them, it'll work for me. :) For now, I'll just delete them. No need to complicate my problem.

Steve Trask over 5 years ago

Hi Tom,

Sounds mad but might be worth going back to the beginning, uninstall everything and make sure you have got things in the right place.

For reference the location of my things are:

Wamp folder direct on C:
Ruby193 direct on C:
devkit direct on C:

Hope this helps

Steve

Tom Hogan over 5 years ago

Steve,

Before uninstalling everything, I went through all the modules to be sure I could access them to be sure they were working. So for example, at the command prompt I typed Ruby -v which gave me the Ruby version. Typing npm brings up a list of commands, etc.

By doing this I was able to ensure that each package was working EXCEPT for foundation cli. Having eliminated all the other packages as a problem I figured that my foundation cli was the issue so I reinstalled foundation cli using the gem install command, then re-ran the foundation new project_name --libsass command and EUREKA! it worked! I then did a "grunt build" and everything looks fine with a nice directory of folders underneath the root directory.

Now all I have to do is figure out how it all works. lol

I want to thank you for your time helping me to resolve the issue. It is much appreciated.

Tom

Steve Trask over 5 years ago

No problem anytime

Steve

Tom Hogan over 5 years ago

All,

After spending some time getting Grunt and Libsass along with Ruby, Bower, Git, NodeJS, etc. up and running on Windows, I created a step-by-step How-To that some may find helpful.

http://foundation.zurb.com/forum/posts/11597-how-to-install-grunt-and-libsass-on-windows

Tom