Meteor is loading two instances of jQuery and loading bootstrap twice

1

I have a Meteor app that uses a reusable meteor package that I an writing too. The local package uses npm jquery and npm bootstrap and so does the app.

But it looks like When I add the package to the app, Meteor loads two separate instances of jquery and also loads bootstrap twice.

Here is the package.js snippet for including npm dependencies for the meteor package.

Npm.depends({
  'jquery': '2.2.4',
  'jquery-ui': '1.12.1',
  'bootstrap': '3.3.7',
  'bootstrap-select': '1.12.2',
  'datatables.net': '1.10.15',
  'datatables.net-dt': '1.10.15',
  'sweetalert': '1.1.3',
  'toastr': '2.1.2',
  'eonasdan-bootstrap-datetimepicker': '4.17.47'
});

I am using the bootstrap dropdown and when I click on the drop down, the open drop down code is run twice, once in the bootstrap code from the package and once from the app. As a result the toggleClass adds and then removes the ‘open’ from the dropdown container resulting in the dropdown never really opening.

How do I make sure that Meteor package and app use the same npm jquery and bootstrap instances.

I am using ES6 modules for everything.

2

Don’t depend on the npm package in the Meteor package - only add it in the app.

3

Thanks, but if I use a package in another app that doesn’t load bootstrap, then my local package will not work. Is it required to specify package npm dependencies at the app level? What are MDG guidelines on npm dependencies for meteor packages? Thanks again

4

Here’s a guide article about it! https://guide.meteor.com/writing-atmosphere-packages.html#peer-npm-dependencies

2 Likes
5

What would make that article perfect is if there was a link to an atmosphere package that demonstrated how to do that. I’m wondering how to handle package.js, other files in the same package, etc.

6

A really small package which demonstrates this sufficiently to see how to use it without much noise is npm-mongo.