Menu icon Foundation
Problem Using Bower Components

Hello I am a newbie to foundation, we used to edit the components before bower and now I am afraid to touch them, and all the css and components used to get removed when we launched. I searched all the posts for an hour and I found someone asking a good question, but I could not find the answer anywhere, it was; Do we remove the bower folder when we launch the site?

someone please help me understand.
Thank you.

bower componentslaunching foundation 5 siteusing bower componentslaunching site bower components

Hello I am a newbie to foundation, we used to edit the components before bower and now I am afraid to touch them, and all the css and components used to get removed when we launched. I searched all the posts for an hour and I found someone asking a good question, but I could not find the answer anywhere, it was; Do we remove the bower folder when we launch the site?

someone please help me understand.
Thank you.

Karl Ward over 5 years ago

Depends on your setup ... I am not sure how components got "removed" when you "launched" earlier ... Foundation certainly doesn't remove bower for you, but your process of upload to server (or publish) might include some method for including only the folders your website needs.

If you were editing bower_components earlier, and they were not linked in the published website, that means you must have had a grunt setup (or other preprocessing) to concatenate JS files and render SASS files from within the bower folders.

  • Are you linking to any files inside the bower_components folder directly from within your html documents? (css or javascript)

If the answer is no, then you can safely exclude the bower_components folder on publish.

Ben Hutchings over 5 years ago

Hi Henry,

I have found that linking to files directly within bower_components can be tricky when it comes to updating foundation as some of them can/will be moved or removed without warning. Also bower_components is commonly included in .gitignore so if you are push and pulling from a repository on your live installs it won't include bower_components or anything within it unless you've modified your .gitignore file.

As you're using the SASS setup I assume you're using some sort of preprocessor like Compass, Grunt, CodeKit? If so then I recommend that you 'roll your own' versions of the files you need. On some projects I like to bundle all the JS I need into one file called production.js in the js folder. Then when it comes to Foundation updates I choose which new/updated components to include.

Cheers,
Ben

Henry Lemmon over 5 years ago

Thank you Karl and Ben for the information,
Let me provide more information here.
I am using jointsWP which is a wordpress theme based on foundation by Jeremy Englert website: jointswp.com

Sass and Compass (ruby version) via windows command line

Yes Karl
The bower files as far as I can tell are only providing 3 files normalize.js foundation.js and jquery.js. I made changes to one of the components files and it was not compiled by the preprocessor? so I can easily exclude the bower stuff. but I need to see if I can relocate the components into the place where i can use them.

Yea Ben I am going to have to roll my own, but I need to get something as close to right to start with. I need a wordpress theme that uses foundation. I like Jointswp, so I am going to attempt to make it work for me.

any more feedback will come in handy.
Thanks.

Adrian Durran over 5 years ago

How Sass is processed will be down to your config.rb file..this has the general folder locations etc...also the preprocessor will only process *.scss files so you need to put the locations of these folders in the config.rb

If you are only using the three files mentioned then I would keep it simple and just create a JS folder and link to that from within your site. It sounds like you don't really need the bower folder.
Also perhaps a good idea to use the minified versions of the above too (to put in your JS folder).

Henry Lemmon over 5 years ago

I do not know how to convey my dilemma.

jointswp.com is where I got the theme. works great, uses wordpress and incorporates sass and compass and foundation.zurb grid system. All the scss and the components used to reside in one dir, but now they incorporate some package management system called bower. that seperates and isolates the files from each other so the components....

can someone look at the file structure and let me know what I am looking at?

do the components in the bower_components get updated as well so if I change any of those files do I lose those changes on update?

can I just point to the components from the library (move the foundations.scss) to the library and adjust the addresses to point back to the bower_components where they came from?

Help please