Menu icon Foundation

Developer | Los Angeles, California

My Posts

  • NEW
  • Foundation manual install vs cli

    By michel bocande

    zurb stack

    Andrew, for some reasons, my post disappeared!!! Here is to answer your question.   OK, "npm start" opened up in a browser and looked as expected - let’s call it localhost:8000   Here is my src file structure:   src assets dat... (continued)




  • 1
    Reply
  • CSS Sync problem

    By michel bocande

    CSS Browser

    Hi!   I've install the Stack version of Foundation 6, wether I'm using Atom, Brackets, Sublime Text or even DW and my files are not rendered properly in the browser.  I see my html content and no CSS applied to it. For example, the URL I... (continued)

    Last Reply by cs joshi about 1 year ago




My Comments

michel bocande commented on michel bocande's post over 1 year

That post was a long time ago! I finally resolved the issue. Thanks anyway.
Since you're here I have another problem - maybe you can help.
[16:07:17] Failed to load external module @babel/register
[16:07:17] Requiring external module babel-register
module.js:538
    throw err;
   
 
Error: Cannot find module 'etag'
    at Function.Module._resolveFilename (module.js:536:15)
    at Function.Module._load (module.js:466:25)
    at Module.require (module.js:579:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/Users/michelbocande/Web/martiniquecruise/node_modules/browser-sync/client/index.js:3:13)
    at Module._compile (module.js:635:30)
    at Module._extensions..js (module.js:646:10)
    at Object.require.extensions.(anonymous function) as .js
    at Module.load (module.js:554:32)
    at tryModuleLoad (module.js:497:12)
Error: foundation-zurb-template@1.0.0 start: gulp
Exit status 1
    at EventEmitter.<anonymous> (/usr/local/lib/node_modules/foundation-cli/node_modules/npm/lib/utils/lifecycle.js:217:16)
    at emitTwo (events.js:126:13)
    at EventEmitter.emit (events.js:214:7)
    at ChildProcess.<anonymous> (/usr/local/lib/node_modules/foundation-cli/node_modules/npm/lib/utils/spawn.js:24:14)
    at emitTwo (events.js:126:13)
    at ChildProcess.emit (events.js:214:7)
    at maybeClose (internal/child_process.js:925:16)
 
    at Process.ChildProcess._handle.onexit (internal/child_process.js:209:5)

michel bocande commented on michel bocande's post over 1 year

sorry for the UGLY layout but this forum is keep removing my staff and I'm scared to touch anything

michel bocande commented on michel bocande's post over 1 year

For some reasons, this post was supposed to come before the last one and it disappeared. This is to answer your question.
 
OK, "npm start" opened up in a browser and looked as expected - let’s call it localhost:8000
 
Here is my src file structure:
 
src
assets
data
layout
default.html
pages
index.html        
partials
styleguide
 
Let’s say I use bracket - If I am in index.html I would preview this page in Chrome for example. The result should look like localhost:8000
Instead I have the unstyled version of localhost:8000 like below -
Welcome to Foundation for Sites
We’re stoked you want to try Foundation!
To get going, this file (index.html) includes some basic styles you can modify, play around with, or totally destroy to get going.
Once you've exhausted the fun in this document, you should check out:
Foundation Documentation Everything you need to know about using the framework.
Foundation Code Skills These online courses offer you a chance to better understand how Foundation works and how you can master it to create awesome projects.
Foundation Forum Join the Foundation community to ask a question or show off your knowledge.
Foundation on Github Latest code, issue reports, feature requests and more.
@zurbfoundation Ping us on Twitter if you have questions. When you build something with this we'd love to see it (and send you a totally boss sticker).
Here’s your basic grid:
This is a twelve column section in a grid-x with grid-margin-x. Each of these includes a div.callout element so you can see where the cell are - it's not required at all for the grid.
Six cell
Six cell
Four cell
Four cell
Four cell
 
 
In this condition, it’s impossible to see changes I would make in /src/pages/index.html or any other files in /src/pages/

michel bocande commented on michel bocande's post over 1 year

Andrew,
I want to learn how to install the Zurb Template manually.
I went to the foundation doc but frankly I think they're talking to experts not to even intermediate. There is not enough walk through in my opinion. Could you point me to detailed documentations? Videos are welcome. Or if you could put me on the right track that would be very much appreciated.
I really want to learn Foundation.
Thanks!

michel bocande commented on michel bocande's post over 1 year

OK, "npm start" opened up in a browser and looked as expected - let’s call that url localhost:8000
 
Here is my src file structure:
 
src
assets
data
layout
  default.html
pages
  index.html        
partials
styleguide
 
Let’s say I use bracket - If I am in index.html I would preview this page in Chrome for example. The result should look like localhost:8000
Instead I have the unstyled version of localhost:8000 like below -
 
Welcome to Foundation for Sites
We’re stoked you want to try Foundation!
To get going, this file (index.html) includes some basic styles you can modify, play around with, or totally destroy to get going.
Once you've exhausted the fun in this document, you should check out:
Foundation Documentation Everything you need to know about using the framework.
Foundation Code Skills These online courses offer you a chance to better understand how Foundation works and how you can master it to create awesome projects.
Foundation Forum Join the Foundation community to ask a question or show off your knowledge.
Foundation on Github Latest code, issue reports, feature requests and more.
@zurbfoundation Ping us on Twitter if you have questions. When you build something with this we'd love to see it (and send you a totally boss sticker).
Here’s your basic grid:
This is a twelve column section in a grid-x with grid-margin-x. Each of these includes a div.callout element so you can see where the cell are - it's not required at all for the grid.
Six cell
Six cell
Four cell
Four cell
Four cell
 
 
In this condition, it’s impossible to see changes I would make in /src/pages/index.html or any other files in /src/pages/
 

michel bocande commented on michel bocande's post over 1 year

Hi guys,
 
Thanks for your help, but could you walk me through step by step to install or modify those files. I'm not familiar yet to those scripts. I don't know which one to follow at this point - Andrew or Nikki?
Should I worry about the errors message Failed to load external module @babel/register and Requiring external module babel-register
In fact, my problem is that when previewing my HTML files in the browser the CSS is missing. That happens only from the src folder. The Dist folder output the HTML files entirely with CSS. Therefore, Foundation is useless at this point.
Does it make sense?
Thanks a lot guys!

michel bocande commented on michel bocande's post over 1 year

... Where is Rafi? Is there anyone at Zurb who can help? 
 
Thank you!

Posts Followed

No Content

Following

    No Content

Followers

My Posts





My Comments

You commented on michel bocande's post over 1 year

That post was a long time ago! I finally resolved the issue. Thanks anyway.
Since you're here I have another problem - maybe you can help.
[16:07:17] Failed to load external module @babel/register
[16:07:17] Requiring external module babel-register
module.js:538
    throw err;
   
 
Error: Cannot find module 'etag'
    at Function.Module._resolveFilename (module.js:536:15)
    at Function.Module._load (module.js:466:25)
    at Module.require (module.js:579:17)
    at require (internal/module.js:11:18)
    at Object.<anonymous> (/Users/michelbocande/Web/martiniquecruise/node_modules/browser-sync/client/index.js:3:13)
    at Module._compile (module.js:635:30)
    at Module._extensions..js (module.js:646:10)
    at Object.require.extensions.(anonymous function) as .js
    at Module.load (module.js:554:32)
    at tryModuleLoad (module.js:497:12)
Error: foundation-zurb-template@1.0.0 start: gulp
Exit status 1
    at EventEmitter.<anonymous> (/usr/local/lib/node_modules/foundation-cli/node_modules/npm/lib/utils/lifecycle.js:217:16)
    at emitTwo (events.js:126:13)
    at EventEmitter.emit (events.js:214:7)
    at ChildProcess.<anonymous> (/usr/local/lib/node_modules/foundation-cli/node_modules/npm/lib/utils/spawn.js:24:14)
    at emitTwo (events.js:126:13)
    at ChildProcess.emit (events.js:214:7)
    at maybeClose (internal/child_process.js:925:16)
 
    at Process.ChildProcess._handle.onexit (internal/child_process.js:209:5)

You commented on michel bocande's post over 1 year

sorry for the UGLY layout but this forum is keep removing my staff and I'm scared to touch anything

You commented on michel bocande's post over 1 year

For some reasons, this post was supposed to come before the last one and it disappeared. This is to answer your question.
 
OK, "npm start" opened up in a browser and looked as expected - let’s call it localhost:8000
 
Here is my src file structure:
 
src
assets
data
layout
default.html
pages
index.html        
partials
styleguide
 
Let’s say I use bracket - If I am in index.html I would preview this page in Chrome for example. The result should look like localhost:8000
Instead I have the unstyled version of localhost:8000 like below -
Welcome to Foundation for Sites
We’re stoked you want to try Foundation!
To get going, this file (index.html) includes some basic styles you can modify, play around with, or totally destroy to get going.
Once you've exhausted the fun in this document, you should check out:
Foundation Documentation Everything you need to know about using the framework.
Foundation Code Skills These online courses offer you a chance to better understand how Foundation works and how you can master it to create awesome projects.
Foundation Forum Join the Foundation community to ask a question or show off your knowledge.
Foundation on Github Latest code, issue reports, feature requests and more.
@zurbfoundation Ping us on Twitter if you have questions. When you build something with this we'd love to see it (and send you a totally boss sticker).
Here’s your basic grid:
This is a twelve column section in a grid-x with grid-margin-x. Each of these includes a div.callout element so you can see where the cell are - it's not required at all for the grid.
Six cell
Six cell
Four cell
Four cell
Four cell
 
 
In this condition, it’s impossible to see changes I would make in /src/pages/index.html or any other files in /src/pages/

You commented on michel bocande's post over 1 year

Andrew,
I want to learn how to install the Zurb Template manually.
I went to the foundation doc but frankly I think they're talking to experts not to even intermediate. There is not enough walk through in my opinion. Could you point me to detailed documentations? Videos are welcome. Or if you could put me on the right track that would be very much appreciated.
I really want to learn Foundation.
Thanks!

You commented on michel bocande's post over 1 year

OK, "npm start" opened up in a browser and looked as expected - let’s call that url localhost:8000
 
Here is my src file structure:
 
src
assets
data
layout
  default.html
pages
  index.html        
partials
styleguide
 
Let’s say I use bracket - If I am in index.html I would preview this page in Chrome for example. The result should look like localhost:8000
Instead I have the unstyled version of localhost:8000 like below -
 
Welcome to Foundation for Sites
We’re stoked you want to try Foundation!
To get going, this file (index.html) includes some basic styles you can modify, play around with, or totally destroy to get going.
Once you've exhausted the fun in this document, you should check out:
Foundation Documentation Everything you need to know about using the framework.
Foundation Code Skills These online courses offer you a chance to better understand how Foundation works and how you can master it to create awesome projects.
Foundation Forum Join the Foundation community to ask a question or show off your knowledge.
Foundation on Github Latest code, issue reports, feature requests and more.
@zurbfoundation Ping us on Twitter if you have questions. When you build something with this we'd love to see it (and send you a totally boss sticker).
Here’s your basic grid:
This is a twelve column section in a grid-x with grid-margin-x. Each of these includes a div.callout element so you can see where the cell are - it's not required at all for the grid.
Six cell
Six cell
Four cell
Four cell
Four cell
 
 
In this condition, it’s impossible to see changes I would make in /src/pages/index.html or any other files in /src/pages/
 

You commented on michel bocande's post over 1 year

Hi guys,
 
Thanks for your help, but could you walk me through step by step to install or modify those files. I'm not familiar yet to those scripts. I don't know which one to follow at this point - Andrew or Nikki?
Should I worry about the errors message Failed to load external module @babel/register and Requiring external module babel-register
In fact, my problem is that when previewing my HTML files in the browser the CSS is missing. That happens only from the src folder. The Dist folder output the HTML files entirely with CSS. Therefore, Foundation is useless at this point.
Does it make sense?
Thanks a lot guys!

You commented on michel bocande's post over 1 year

... Where is Rafi? Is there anyone at Zurb who can help? 
 
Thank you!

Posts Followed

No Content

Following

  • No Content

Followers

  • No Content