Menu icon Foundation

Developer | Florida

Full stack developer, designer, coder since 2001, programmer since 1987.

My Posts









My Comments

holmescreek commented on Gilles's post 10 months

Did you find a solution? I'm in the same dilemma. I managed to get both working about 7 months ago on my Mac - took 2 days.
Currently, I just chose to install Ubuntu under a Virtual Machine (running on my Mac) and just installing Foundation 5 on it, then in the Ubuntu terminal change into an older project folder in my Mac's folder and run Grunt. So far, I just can't get the Foundation installation working after 2 days -- something to do with SASS. I'm guessing it's not working because some newer version of bower, node, npm or something just isn't compatible.
Let us know if you find an answer!
 

holmescreek commented on holmescreek's post over 1 year

Hi Rafi, thanks for your reply - I've been out for several days and leaving early today.
I wasn't getting answers in this post, however, I found another post where this discussion is ongoing.
You can find the thread in the foundation forum here.
 
 

holmescreek commented on holmescreek's post over 1 year

Thanks for the reply Rafi, I've been out for several days and taking today off early.
FYI -
I wasn't getting an answer on my post, but, I found a different post where this was discussed and asked my question over there -- which is still ongoing.
 
https://foundation.zurb.com/forum/posts/54479-foundation-5-technical-support-for-hire

holmescreek commented on Jay Todtenbier's post over 1 year

 Hi Val, sorry I've been out for a while and about to leave for the day.
I haven't tried your examples, however, this is my grunt file that I forgot to add.
 
Running grunt watch
Gruntfile.js
 
module.exports = function(grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),

sass: {
  options: {
    includePaths: ['bower_components/foundation/scss']
  },
  dist: {
    options: {
      outputStyle: 'compressed',
      sourceMap: true,
    },
    files: {
      'css/app.css': 'scss/app.scss'
    }
  }
},

watch: {
  grunt: {
    options: {
      reload: true
    },
    files: ['Gruntfile.js']
  },

  sass: {
    files: 'scss/**/*.scss',
    tasks: ['sass']
  }
}

});

grunt.loadNpmTasks('grunt-sass');
grunt.loadNpmTasks('grunt-contrib-watch');

grunt.registerTask('build', ['sass']);
grunt.registerTask('default', ['build','watch']);
}

holmescreek commented on Jay Todtenbier's post over 1 year

Oh, forgot...
bower 1.8.2
grunt-cli v1.2.0
grunt v0.4.5 

holmescreek commented on Jay Todtenbier's post over 1 year

Thanks for the quick reply Val.
Installed:
OS/X 10.11.6
npm 5.6.0
node 9.3.0
Foundation CLI version 2.2.5  (I've also tried with older versions of the CLI tool)
ruby 2.5.0p0
Python 2.7.10
 
 
Below is the output I get on all my old Foundation 5.5.3 sites. npm start and foundation watch work fine on Foundation 6 sites.
This is the results of npm start and the log file:
warrens-Mac-mini:templates warren$ npm start
npm ERR! missing script: start

npm ERR! A complete log of this run can be found in:
npm ERR! /Volumes/MASTER/Users/warren/.npm/logs/2018-01-07T15_33_58_971Z-debug.log
warrens-Mac-mini:templates warren$ cat /Volumes/MASTER/Users/warren/.npm/_logs/2018-01-07T15_33_58_971Z-debug.log
0 info it worked if it ends with ok
1 verbose cli [ '/usr/local/bin/node', '/usr/local/bin/npm', 'start' ]
2 info using [email protected]
3 info using [email protected]
4 verbose stack Error: missing script: start
4 verbose stack at run (/usr/local/lib/node_modules/npm/lib/run-script.js:151:19)
4 verbose stack at /usr/local/lib/node_modules/npm/lib/run-script.js:61:5
4 verbose stack at /usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:115:5
4 verbose stack at /usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:402:5
4 verbose stack at checkBinReferences
(/usr/local/lib/nodemodules/npm/node_modules/read-package-json/read-json.js:357:45)
4 verbose stack at final (/usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:400:3)
4 verbose stack at then (/usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:160:5)
4 verbose stack at /usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:348:12
4 verbose stack at /usr/local/lib/node_modules/npm/node_modules/graceful-fs/graceful-fs.js:78:16
4 verbose stack at FSReqWrap.readFileAfterClose as oncomplete
5 verbose cwd /Volumes/MASTER/Users/warren/Documents/webprojects/libertyco-processwire/site/templates
6 verbose Darwin 15.6.0
7 verbose argv "/usr/local/bin/node" "/usr/local/bin/npm" "start"
8 verbose node v9.3.0
9 verbose npm v5.6.0
10 error missing script: start
11 verbose exit [ 1, true ]

 
Using: $ foundation watch:
warrens-Mac-mini:templates warren$ foundation watch
Error: missing script: start
at run (/usr/local/lib/node_modules/foundation-cli/node_modules/npm/lib/run-script.js:142:19)
at /usr/local/lib/node_modules/foundation-cli/node_modules/npm/lib/run-script.js:58:5
at /usr/local/lib/node_modules/foundation-cli/node_modules/npm/node_modules/read-package-json/read-json.js:356:5
at checkBinReferences
(/usr/local/lib/node_modules/foundation-cli/node_modules/npm/node_modules/read-package-json/read-json.js:320:45)
at final (/usr/local/lib/node_modules/foundation-cli/node_modules/npm/node_modules/read-package-json/read-json.js:354:3)
at then (/usr/local/lib/node_modules/foundation-cli/node_modules/npm/node_modules/read-package-json/read-json.js:124:5)
at /usr/local/lib/node_modules/foundation-cli/node_modules/npm/node_modules/read-package-json/read-json.js:311:12
at /usr/local/lib/node_modules/foundation-cli/node_modules/npm/node_modules/graceful-fs/graceful-fs.js:78:16
at FSReqWrap.readFileAfterClose as oncomplete

 
running : grunt watch 
warrens-Mac-mini:templates warren$ grunt --verbose
Initializing
Command-line options: --verbose

Reading "Gruntfile.js" Gruntfile...OK

Registering Gruntfile tasks.
Reading package.json...OK
Parsing package.json...OK
Initializing config...OK

Registering "grunt-sass" local Npm module tasks.
Reading /Volumes/MASTER/Users/warren/Documents/webprojects/libertyco-processwire/site/templates/node_modules/grunt-sass/package.json...OK
Parsing /Volumes/MASTER/Users/warren/Documents/webprojects/libertyco-processwire/site/templates/node_modules/grunt-sass/package.json...OK
Loading "sass.js" tasks...ERROR
>> Error: The libsass binding was not found in /Volumes/MASTER/Users/warren/Documents/webprojects/libertyco-processwire/site/templates/node_modules/node-sass/vendor/darwin-x64-59/binding.node
>> This usually happens because your node version has changed.
>> Run npm rebuild node-sass to build the binding for your current node version.
>> at Object.sass.getBinaryPath (/Volumes/MASTER/Users/warren/Documents/webprojects/libertyco-processwire/site/templates/node_modules/node-sass/lib/extensions.js:150:11)
>> at Object.<anonymous> (/Volumes/MASTER/Users/warren/Documents/webprojects/libertyco-processwire/site/templates/node_modules/node-sass/lib/index.js:16:36)
>> at Module._compile (module.js:660:30)
>> at Object.Module._extensions..js (module.js:671:10)
>> at Module.load (module.js:573:32)
>> at tryModuleLoad (module.js:513:12)
>> at Function.Module._load (module.js:505:3)
>> at Module.require (module.js:604:17)
>> at require (internal/module.js:11:18)
>> at Object.<anonymous> (/Volumes/MASTER/Users/warren/Documents/webprojects/libertyco-processwire/site/templates/node_modules/grunt-sass/tasks/sass.js:5:12)

Registering "grunt-contrib-watch" local Npm module tasks.
Reading /Volumes/MASTER/Users/warren/Documents/webprojects/libertyco-processwire/site/templates/node_modules/grunt-contrib-watch/package.json...OK
Parsing /Volumes/MASTER/Users/warren/Documents/webprojects/libertyco-processwire/site/templates/node_modules/grunt-contrib-watch/package.json...OK
Loading "watch.js" tasks...OK
+ watch
Loading "Gruntfile.js" tasks...OK
+ build, default

No tasks specified, running default tasks.
Running tasks: default

Running "default" task

Running "build" task
Warning: Task "sass" not found. Use --force to continue.

Aborted due to warnings.
with grunt I've uninstall/reinstalled npm, libsass, etc., countless times.
 
Again, Foundation 6 sites run fine, but all of my Foundation 5.x sites have the above results.
 

holmescreek commented on Jay Todtenbier's post over 1 year

 I'm having somewhat of the same issue - on a Mac as well. I currently develop with Foundation 6, but today I needed to go back and work on a site built with Foundation 5.5.3 - I tried the above, Val, and it doesn't work. In addition, I've spent the whole day trying to get "foundation watch" or "npm start" to work on this 5.5.3 site to no avail - everything from re-installing npm, bower, ruby, python, gem and so on...
I tried with other 5.5.3 projects and couldn't get any to watch for sass/js changes.
Did you guys ever figure out a solution to this? 

holmescreek commented on Stella Clover's post about 2 years

This is crazy. I try creating a post with a legitimate question regarding Foundation and every time it gets flagged and deleted as spam, but, to top it off this post about marketing just breezes through!?

holmescreek commented on Kris Jones's post about 2 years

@Sven
Just curious, wouldn't it be better to put your jquery script tag in the head section just in case you add some custom jQuery in the bodies in certain pages.  For example, I have a hero slider that I use on a home page, so I added the jQuery just past the content for that page vs putting it in a global site footer (as I don't need it on other pages).
 

holmescreek commented on holmescreek's post about 2 years

Yeah, the first post was flagged as spam and I couldn't go back and copy and paste then revise it in a new post (figured something I wrote set off the spam filter).
---
Anyway, my question about breakpoints applies to both posts, the first about topbar underlapping  and the second about navigation items with white space, so I'll just combine the two here.
I can change my $medium breakpoint setting, for instance to 950px, and things like medium-up, medium-only, etc work fine.
However, I tried adding breakpoint called "custom", but things like data-hide-for="custom" or "custom-up", "custom-only", etc., won't work. This would seem the most logical way to set a custom breakpoint.
 
$breakpoints: (

small: 0,
tiny:460px,
medium: 640px,
custom: 950px,
large: 1024px,
xlarge: 1200px,
xxlarge: 1440px,
);

$print-breakpoint: large;
$breakpoint-classes: (small tiny custom medium large);

...
...

// 37. Top Bar
...
$topbar-unstack-breakpoint: custom;
 
It seems that defining a "custom" size, I should be able to use things like data-hide-for="custom", "custom-dropdown", etc., in my html, but it fails to work.
 
I also tried things like :
 
 
.title-bar {
@include breakpoint(custom) {
width:950px;
}
}
 
 

Posts Followed



  • 2
    Replies
  • js files not loading

    By Kris Jones

    installation js jquery

    I installed Foundation using CLI. Everything looks like it went smoothly. I have my project set up now. I pasted in the basic template and it cannot load the js scripts. Here's what I pasted in: &lt;script src="js/vendor/jquery.js"&gt;&lt;/script&gt; &lt... (continued)

    Last Reply by holmescreek about 2 years ago





Following

    No Content

Followers

My Posts

My Comments

You commented on Gilles's post 10 months

Did you find a solution? I'm in the same dilemma. I managed to get both working about 7 months ago on my Mac - took 2 days.
Currently, I just chose to install Ubuntu under a Virtual Machine (running on my Mac) and just installing Foundation 5 on it, then in the Ubuntu terminal change into an older project folder in my Mac's folder and run Grunt. So far, I just can't get the Foundation installation working after 2 days -- something to do with SASS. I'm guessing it's not working because some newer version of bower, node, npm or something just isn't compatible.
Let us know if you find an answer!
 

You commented on holmescreek's post over 1 year

Hi Rafi, thanks for your reply - I've been out for several days and leaving early today.
I wasn't getting answers in this post, however, I found another post where this discussion is ongoing.
You can find the thread in the foundation forum here.
 
 

You commented on holmescreek's post over 1 year

Thanks for the reply Rafi, I've been out for several days and taking today off early.
FYI -
I wasn't getting an answer on my post, but, I found a different post where this was discussed and asked my question over there -- which is still ongoing.
 
https://foundation.zurb.com/forum/posts/54479-foundation-5-technical-support-for-hire

You commented on Jay Todtenbier's post over 1 year

 Hi Val, sorry I've been out for a while and about to leave for the day.
I haven't tried your examples, however, this is my grunt file that I forgot to add.
 
Running grunt watch
Gruntfile.js
 
module.exports = function(grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),

sass: {
  options: {
    includePaths: ['bower_components/foundation/scss']
  },
  dist: {
    options: {
      outputStyle: 'compressed',
      sourceMap: true,
    },
    files: {
      'css/app.css': 'scss/app.scss'
    }
  }
},

watch: {
  grunt: {
    options: {
      reload: true
    },
    files: ['Gruntfile.js']
  },

  sass: {
    files: 'scss/**/*.scss',
    tasks: ['sass']
  }
}

});

grunt.loadNpmTasks('grunt-sass');
grunt.loadNpmTasks('grunt-contrib-watch');

grunt.registerTask('build', ['sass']);
grunt.registerTask('default', ['build','watch']);
}

You commented on Jay Todtenbier's post over 1 year

Oh, forgot...
bower 1.8.2
grunt-cli v1.2.0
grunt v0.4.5 

You commented on Jay Todtenbier's post over 1 year

Thanks for the quick reply Val.
Installed:
OS/X 10.11.6
npm 5.6.0
node 9.3.0
Foundation CLI version 2.2.5  (I've also tried with older versions of the CLI tool)
ruby 2.5.0p0
Python 2.7.10
 
 
Below is the output I get on all my old Foundation 5.5.3 sites. npm start and foundation watch work fine on Foundation 6 sites.
This is the results of npm start and the log file:
warrens-Mac-mini:templates warren$ npm start
npm ERR! missing script: start

npm ERR! A complete log of this run can be found in:
npm ERR! /Volumes/MASTER/Users/warren/.npm/logs/2018-01-07T15_33_58_971Z-debug.log
warrens-Mac-mini:templates warren$ cat /Volumes/MASTER/Users/warren/.npm/_logs/2018-01-07T15_33_58_971Z-debug.log
0 info it worked if it ends with ok
1 verbose cli [ '/usr/local/bin/node', '/usr/local/bin/npm', 'start' ]
2 info using [email protected]
3 info using [email protected]
4 verbose stack Error: missing script: start
4 verbose stack at run (/usr/local/lib/node_modules/npm/lib/run-script.js:151:19)
4 verbose stack at /usr/local/lib/node_modules/npm/lib/run-script.js:61:5
4 verbose stack at /usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:115:5
4 verbose stack at /usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:402:5
4 verbose stack at checkBinReferences
(/usr/local/lib/nodemodules/npm/node_modules/read-package-json/read-json.js:357:45)
4 verbose stack at final (/usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:400:3)
4 verbose stack at then (/usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:160:5)
4 verbose stack at /usr/local/lib/node_modules/npm/node_modules/read-package-json/read-json.js:348:12
4 verbose stack at /usr/local/lib/node_modules/npm/node_modules/graceful-fs/graceful-fs.js:78:16
4 verbose stack at FSReqWrap.readFileAfterClose as oncomplete
5 verbose cwd /Volumes/MASTER/Users/warren/Documents/webprojects/libertyco-processwire/site/templates
6 verbose Darwin 15.6.0
7 verbose argv "/usr/local/bin/node" "/usr/local/bin/npm" "start"
8 verbose node v9.3.0
9 verbose npm v5.6.0
10 error missing script: start
11 verbose exit [ 1, true ]

 
Using: $ foundation watch:
warrens-Mac-mini:templates warren$ foundation watch
Error: missing script: start
at run (/usr/local/lib/node_modules/foundation-cli/node_modules/npm/lib/run-script.js:142:19)
at /usr/local/lib/node_modules/foundation-cli/node_modules/npm/lib/run-script.js:58:5
at /usr/local/lib/node_modules/foundation-cli/node_modules/npm/node_modules/read-package-json/read-json.js:356:5
at checkBinReferences
(/usr/local/lib/node_modules/foundation-cli/node_modules/npm/node_modules/read-package-json/read-json.js:320:45)
at final (/usr/local/lib/node_modules/foundation-cli/node_modules/npm/node_modules/read-package-json/read-json.js:354:3)
at then (/usr/local/lib/node_modules/foundation-cli/node_modules/npm/node_modules/read-package-json/read-json.js:124:5)
at /usr/local/lib/node_modules/foundation-cli/node_modules/npm/node_modules/read-package-json/read-json.js:311:12
at /usr/local/lib/node_modules/foundation-cli/node_modules/npm/node_modules/graceful-fs/graceful-fs.js:78:16
at FSReqWrap.readFileAfterClose as oncomplete

 
running : grunt watch 
warrens-Mac-mini:templates warren$ grunt --verbose
Initializing
Command-line options: --verbose

Reading "Gruntfile.js" Gruntfile...OK

Registering Gruntfile tasks.
Reading package.json...OK
Parsing package.json...OK
Initializing config...OK

Registering "grunt-sass" local Npm module tasks.
Reading /Volumes/MASTER/Users/warren/Documents/webprojects/libertyco-processwire/site/templates/node_modules/grunt-sass/package.json...OK
Parsing /Volumes/MASTER/Users/warren/Documents/webprojects/libertyco-processwire/site/templates/node_modules/grunt-sass/package.json...OK
Loading "sass.js" tasks...ERROR
>> Error: The libsass binding was not found in /Volumes/MASTER/Users/warren/Documents/webprojects/libertyco-processwire/site/templates/node_modules/node-sass/vendor/darwin-x64-59/binding.node
>> This usually happens because your node version has changed.
>> Run npm rebuild node-sass to build the binding for your current node version.
>> at Object.sass.getBinaryPath (/Volumes/MASTER/Users/warren/Documents/webprojects/libertyco-processwire/site/templates/node_modules/node-sass/lib/extensions.js:150:11)
>> at Object.<anonymous> (/Volumes/MASTER/Users/warren/Documents/webprojects/libertyco-processwire/site/templates/node_modules/node-sass/lib/index.js:16:36)
>> at Module._compile (module.js:660:30)
>> at Object.Module._extensions..js (module.js:671:10)
>> at Module.load (module.js:573:32)
>> at tryModuleLoad (module.js:513:12)
>> at Function.Module._load (module.js:505:3)
>> at Module.require (module.js:604:17)
>> at require (internal/module.js:11:18)
>> at Object.<anonymous> (/Volumes/MASTER/Users/warren/Documents/webprojects/libertyco-processwire/site/templates/node_modules/grunt-sass/tasks/sass.js:5:12)

Registering "grunt-contrib-watch" local Npm module tasks.
Reading /Volumes/MASTER/Users/warren/Documents/webprojects/libertyco-processwire/site/templates/node_modules/grunt-contrib-watch/package.json...OK
Parsing /Volumes/MASTER/Users/warren/Documents/webprojects/libertyco-processwire/site/templates/node_modules/grunt-contrib-watch/package.json...OK
Loading "watch.js" tasks...OK
+ watch
Loading "Gruntfile.js" tasks...OK
+ build, default

No tasks specified, running default tasks.
Running tasks: default

Running "default" task

Running "build" task
Warning: Task "sass" not found. Use --force to continue.

Aborted due to warnings.
with grunt I've uninstall/reinstalled npm, libsass, etc., countless times.
 
Again, Foundation 6 sites run fine, but all of my Foundation 5.x sites have the above results.
 

You commented on Jay Todtenbier's post over 1 year

 I'm having somewhat of the same issue - on a Mac as well. I currently develop with Foundation 6, but today I needed to go back and work on a site built with Foundation 5.5.3 - I tried the above, Val, and it doesn't work. In addition, I've spent the whole day trying to get "foundation watch" or "npm start" to work on this 5.5.3 site to no avail - everything from re-installing npm, bower, ruby, python, gem and so on...
I tried with other 5.5.3 projects and couldn't get any to watch for sass/js changes.
Did you guys ever figure out a solution to this? 

You commented on Stella Clover's post about 2 years

This is crazy. I try creating a post with a legitimate question regarding Foundation and every time it gets flagged and deleted as spam, but, to top it off this post about marketing just breezes through!?

You commented on Kris Jones's post about 2 years

@Sven
Just curious, wouldn't it be better to put your jquery script tag in the head section just in case you add some custom jQuery in the bodies in certain pages.  For example, I have a hero slider that I use on a home page, so I added the jQuery just past the content for that page vs putting it in a global site footer (as I don't need it on other pages).
 

You commented on holmescreek's post about 2 years

Yeah, the first post was flagged as spam and I couldn't go back and copy and paste then revise it in a new post (figured something I wrote set off the spam filter).
---
Anyway, my question about breakpoints applies to both posts, the first about topbar underlapping  and the second about navigation items with white space, so I'll just combine the two here.
I can change my $medium breakpoint setting, for instance to 950px, and things like medium-up, medium-only, etc work fine.
However, I tried adding breakpoint called "custom", but things like data-hide-for="custom" or "custom-up", "custom-only", etc., won't work. This would seem the most logical way to set a custom breakpoint.
 
$breakpoints: (

small: 0,
tiny:460px,
medium: 640px,
custom: 950px,
large: 1024px,
xlarge: 1200px,
xxlarge: 1440px,
);

$print-breakpoint: large;
$breakpoint-classes: (small tiny custom medium large);

...
...

// 37. Top Bar
...
$topbar-unstack-breakpoint: custom;
 
It seems that defining a "custom" size, I should be able to use things like data-hide-for="custom", "custom-dropdown", etc., in my html, but it fails to work.
 
I also tried things like :
 
 
.title-bar {
@include breakpoint(custom) {
width:950px;
}
}
 
 

Posts Followed

Following

  • No Content

Followers

  • No Content