After much effort, I have successfully developed a system to dynamically load document-specific scripts into a Meteor template once it has been rendered:
Template.postPage.onRendered(function(){
var post = Template.currentData();
if(post.libs) post.libs.forEach(function(e){
console.log(e);
$.getScript(e, function(data, text, code){
console.log(text);
}).done(threejs);
function threejs(){
var scene = new THREE.Scene();
};
});
});
Initially, this method worked flawlessly with libraries like Chartist, Chart.js, and d3. However, I encountered an issue when trying to use three.js. While the other libraries were globally accessible, the constructed THREE
object from three.js was nowhere to be found.
I am wondering if I overlooked something crucial, or if wrapping the contents of three.js in an anonymous function for initialization is necessary. If so, could someone kindly provide an example or documentation on how to proceed?
Update: Despite my efforts, I remain perplexed by the issue. Interestingly, by switching to a Content Delivery Network (CDN), the THREE
object loads seamlessly. Nonetheless, I aim to achieve self-sufficiency by hosting from my own server. Any recommendations for additional tests would be greatly appreciated.