Using new zurb foundation 6 with yeoman / grunt

Question

I am trying to include zurb-foundation 6 into a yeoman generated project running grunt. Using bower install foundation-sites --save adds the following files:

On the app/index.html <script src="bower_components/what-input/what-input.js"></script> and
on the app/styles/main.scss @import "foundation-sites/scss/foundation.scss";

The resultant main.css does not contain all the code for zurb-foundation.

How can i add all the required files from foundation onto the main.css?
How can I initialize foundation into the site?

The above should be done using grunt or gulp so i don't have to manually write the code for every project.

also see: https://github.com/bassjobsen/generator-foundation6 — Bass Jobsen, Dec 03 '15 at 23:18

score 3 · Accepted Answer · edited May 23 '17 at 12:31

3

You should @import foundation-sites/foundation-sites.scss instead of @import "foundation-sites/scss/foundation.scss";

or

@import foundation-sites/scss/foundation.scss and add @include foundation-everything; in your main.scss file.

Check this for further explanation: Gulp-sass not compiling Foundation 6 properly

edited May 23 '17 at 12:31

Community

1
1

answered Nov 26 '15 at 11:52

Tomasz Rozmus

1,646
13
21

This generator https://github.com/bassjobsen/generator-foundation6 does the above also. – Sigu Magwa Dec 16 '15 at 14:08

Using new zurb foundation 6 with yeoman / grunt

1 Answers1