Menu
The problem I'm currently experiencing is, that I want to be able to execute only specific scripts and CSS files, because if executed on a wrong page, it produces errors in the browser console.
I'm using "Iron router" for Meteor with only the basic code to make it work. Now, is there a way for me to send scripts as parameters, so it only loads the ones I want the page to load?
710
It's true that there's not an official way of doing this yet, but there are some effective ways of doing this. Take, for example, how I load Disqus into a blog section.
Template.blog.rendered = function() {
setTimeout(function(){
var disqus_shortname = 'disqus_shortname'; // required: replace example with your forum shortname
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})
}
Which is taken from Josh Owen's blog. The difference is I wrap this is a timeout so that it blocks to wait on the template to actually be rendered.
What this script does is create a script element, set its src and append it as a child to either the head or body of the template. Again, it only does so after the template is rendered so that means all of your elements are available to your script.
If you're using Iron Router you can do the same thing with onAfterAction. The key is to append the new script as a child node in your dom. Hope this helps.
33
In short, there isn't. (Yet.)
You probably have a wrong code structure if you've got errors. There are ways to execute code only when it's needed - you should probably take a look at template.rendered and template.created callbacks, as well as iron router controllers. However, that's for execution - everything is loaded on the beginning.
That being said, you technically could use things like require.js to load some scripts dynamically. But this negates most of Meteor's advantages. It's also quite difficult to make it work properly with Meteor.
185
WARNING: NOT THE BEST SOLUTION
OK, this is what I did. I put CSS and JavaScript files on the public folder, then in the <head> I wrote this little script:
$(function() {
if(location.href.indexOf("http://yourpage.com/page") > -1) //where page is the url you want to server the files
$('head').append('<link rel="stylesheet" href="/mobile.app.css" type="text/css" />');
});
While this is not at all the best way to do this, this could be accomplished in a "hacky" way.
But it worked.
1
You can use Preloader. It worked for me :).
1
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
