search

Foundation-for-Jekyll-sites / jekyll-foundation

Start your Jekyll (v3) project with Zurb Foundation for Sites (v6, sass).
MIT License
179 stars 64 forks source link

Use util-map.json to manage the js-dependencies of foundation components #1

Closed core77 closed 8 years ago

core77 commented 8 years ago

How can we use util-map.json smart in the gulpfile / gulp workflow?

captaincoffee commented 8 years ago

Is this why several of the js files are not loading properly? Particularly to do with different menus.

core77 commented 8 years ago

No, I don't think so. The Foundation for Sites JavaScript files aren't included by default.

This gives you the ability to only include files (js/scss) which are required for your project.

If you want to use let's say the top-bar component, you have to do the following things:

  1. uncomment the include for foundation-top-bar in /assets/scss/foundation/_foundation.scss
  2. uncomment the required JavaScript files for foundation-top-bar in gulpfile.js
  3. restart gulp because you edited the gulpfile (ctrl + cand gulp)

I've just upgraded to Foundation for Sites 6.0.5 and saw they moved the util-map.json file into 'lib' folder. That isn't contained in the bower install package.

I'll keep an eye on this, because for this moment I don't know for sure which components needs which JavaScript files.

For testing purposes you can uncomment all the Sass imports and JavaScript files. Then all the components on the kitchen sink page (in your local project) should work!

Feel free to ask again if things don't work.

captaincoffee commented 8 years ago

I truly appreciate the help.

johndnixon commented 8 years ago

My issue may be me being a noob with jekyll, but when I try and use jekyll serve the assets folder doesn't get compiled into the _site folder. Not sure if I'm doing something wrong or if its a possible issue.

core77 commented 8 years ago

@johndnixon You have to use the gulp command for building your site and the assets. That's because we use a gulp workflow here. You can say: Gulp tells jekyll when to build the site. You don't have to run jekyll build or jekyll serve yourself.

To avoid conflicts the compiling of sass is not activated in jekyll (there's no sass_dir in _config.yml). If you want to use the jekyll functionality you can take a look at the jekyll docs.

The reason for me to use gulp was to be able to control the build process with concatenating and minifying the assets and (thanks to browsersync and xip.io) to be able to easily access my local site from smartphones or tablets.

captaincoffee commented 8 years ago

For development, I have uncommented almost everything in the scss and gulp.js files. There seems to be no change in functionality. Any ideas are appreciated.

EDIT - Sorry. I started and stopped several times and it finally caught.

core77 commented 8 years ago

Take a look at the gulpfile.js and check if you have the latest version. The first version had some performance issues...

core77 commented 8 years ago

Discarding this idea.