Combining plugins causing problems?

JavaScript
1

For some projects im working on I thought it would be a good idea to combine some plugins which are used in the entire site (jQuery, Popper, Bootstrap) into one file (vendors.min.js). This is working great. But certain other plugins stop functioning as soon as I add them to vendors.min as well.

Example: For certain sites I use waypoints.js to trigger animations. When I include waypoints.js separately from vendors.min.js

<script src="js/vendors.min.js"></script>
<script src="js/jquery.waypoints.min.js"></script>

everything is working ok, but when I add the complete jquery.waypoints.min code at the end of vendors.min.js it stops functioning!! The same happens with another plugin (jquery.bootstrap-autohidingnavbar.js)

What can be the reason for that to happen? Thank you

2

Does it fail silently, or are you getting any warnings in your console? Could you make a bare-bones demo of this not working and post a link?

1 Like
3

@James_Hibbard I will start to make a bare-bones demo. Hope to show you tomorrow

4

@James_Hibbard I console is giving a TypeError:.

$(...).waypoint is not a function

This is the link to the page with Waypoints included in the vendors.js file

6

Hi donboe, what do you see in the console before the $(...).waypoint is not a function error message?

7

@James_Hibbard

8

Lol, nah mate, I mean the error before that error.

640×566 298 KB

As you can see from that screenshot, it is:

Uncaught Error: Bootstrap tooltips require Tether (http://tether.io/)

which is causing the JavaScript in vendors.min.js to bork.

The $(...).waypoint is not a function is coming from waypoints.html on line 98:

$('.animate-box').waypoint( function( direction ) {

As vendors.min.js errored out, before the waypoints script was parsed.

Anyway, a little bit of Googling shows that it’s an easy fix:

Basically, if you add Tether to vendors.min.js (before Bootstrap), your demo should work as expected.

9

@James_Hibbard Wow!! Great Pullo. Thanks a lot. This is bothering me for quite some time allready. On march 13 I asked in this forum if there was any known conflict between Bootstrap 4 and Waypoints as you can see here.

I saw the error with thether but don’t know enough about JQuery/JS to imagine that that could be the problem. Again thanks a lot. You made my day

1 Like
10

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.