Loading external JS / JQuery script via MeteorJS

Question

I'm trying to load an external script while using Meteor.

Currently using this code in my layout.js to some success.

Meteor.startup( function() {
    $.getScript('js/scripts.js');
});

However, if I go to another url and come back to it, the script no longer works. (I see it not working because my background cover image disappears.)

Radu Chiriac · Accepted Answer · 2016-01-14 09:58:35Z

4

Any external scripts should be placed in client/compatibility, and Meteor will load it for you; no need for $.getScript('js/scripts.js');

You can then instantiate that script on the template like:

Template.game.onRendered(function(){
  $('.grid').isotope({});
});

edited Jan 14, 2016 at 9:58

answered Aug 15, 2015 at 11:37

Radu Chiriac

1,4243 gold badges21 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

eddiewang Over a year ago

that does not work for certain scripts that need to be loaded at the end of the body, after assets have been loaded. (e.g. scripts.js and parallax.js)

Radu Chiriac Over a year ago

Sure it does. Just make sure you always load that script when the Template is ready. In Meteor world you do Template.game.onRendered(function(){}); (like you discovered your self). I don't see where it would look for /js/scripts.js. I the public directory I hope. But that's bad practice for so many reasons.

eddiewang Over a year ago

You're right. I can see why it would be bad practice. I've updated my code to use yours! Additionally, for some reason onRendered only works 50% of the time. I think the Isotope methods are messing up (onRendered doesn't account for images to load, so scripts.js executes the masonry/lightbox functions before images are loaded). Do you know a. if that's the issue and how can I solve it, or b. i'm totally wrong and it's another issue alltogether.

Radu Chiriac Over a year ago

I think it's more of a Isotope issue and not Meteor. It has to deal with images not being cached. Take a look at this example and fire up Isotope only when all images are loaded: http://stackoverflow.com/questions/23387010/isotope-not-working-with-imagesloaded

eddiewang Over a year ago

I'll look into it now. It worked when it was just in pure html/css/js form. The isotope uses the "layoutComplete" msnry.on('layoutComplete', function() { ... }); Does that change things?

|

eddiewang · Accepted Answer · 2015-08-15 00:39:00Z

1

For anyone needing help with this, replace Meteor.startup with Template.name.onRendered. This helped solve my issue. Cheers!

answered Aug 15, 2015 at 0:39

eddiewang

4155 silver badges21 bronze badges

Collectives™ on Stack Overflow

Loading external JS / JQuery script via MeteorJS

2 Answers 2

7 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

7 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related