Menu icon Foundation
How to include jQuery plugins?

How do you add jQuery plugins to your project in Foundation 6.4? I'm using the Zurb Template.  I am trying to add Fancybox but I keep getting a "Uncaught ReferenceError: jQuery is not defined" error. I have tried several ways to get this to work based on things I'm reading on other sites. The Foundation docs seem to be severely lacking in this area and it seems like a lot of people are having trouble with this.

 

Here are 2 ways I've tried to make this happen.

 

1. I've tried placing each .js file in the assets/js folder and adding a line for them under PATHS > entries in config.yml. This copies my javascript files to the dist folder but adds some webpack stuff to the top of them. 

 

2. The other way I've tried is by importing them in app.js by using 

import './lib/jquery.fancybox';

But I still get the jQuery error that I mentioned above. 

 

Please help!

javascript

How do you add jQuery plugins to your project in Foundation 6.4? I'm using the Zurb Template.  I am trying to add Fancybox but I keep getting a "Uncaught ReferenceError: jQuery is not defined" error. I have tried several ways to get this to work based on things I'm reading on other sites. The Foundation docs seem to be severely lacking in this area and it seems like a lot of people are having trouble with this.

 

Here are 2 ways I've tried to make this happen.

 

1. I've tried placing each .js file in the assets/js folder and adding a line for them under PATHS > entries in config.yml. This copies my javascript files to the dist folder but adds some webpack stuff to the top of them. 

 

2. The other way I've tried is by importing them in app.js by using 

import './lib/jquery.fancybox';

But I still get the jQuery error that I mentioned above. 

 

Please help!