Unable to locate three.js following its load via Ajax

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.

Answer №1

After some trial and error, I finally found a solution for my project - the key was to make changes in the source file called three.min.js.

By removing or commenting out the line 'use strict'; at the beginning of three.min.js, the file now loads properly.

This issue seems to be connected to a particular feature/problem in Meteor, which can be explored further here: https://github.com/meteor/meteor/issues/1380

The version of the library fetched from the content delivery network might not have included 'use strict;'. As a precaution, it's advisable to place 'use strict;' after declaring the global THREE namespace.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Identifying button clicks through the use of AJAX and PHP

I'm attempting to utilize AJAX and PHP to determine if a button has been pressed (although this is just for testing purposes). I am able to detect when text is typed into a textbox, but for some reason I cannot detect if a button has been pressed. &l ...

What is the best way to increase the value of a variable using jQuery?

As I work on adding dates to a slider, I find myself needing to increment the values with each click. Initially, I start with the year - 2. $('#adddates').click(function() { var year = 2; $("#slider").dateRangeSlider({ bounds: { ...

Executing JavaScript files stored on my server using the Node.js command line interface

I need guidance on configuring an app that relies on running node generate.js and node generate_texts_index.js in the command prompt. These files are essential for building the necessary data for the app to function correctly. Running these files locally a ...

Can someone show me the JavaScript code to split a string at every instance of ' '?

Hey there! I have a question about manipulating strings. Take a look at this example: var string = '"In Another World" "Magic Books"' I want to create an array that contains every name within the [""]. How can I ach ...

Is there a way to limit tasks for different roles, such as admin and users, in an express.js application

In my current project, I have implemented two main roles: Admin User One of the requirements in my project is to restrict certain tasks for users. For example, only the admin should be able to add new users. However, I am facing an issue where even ...

`The file cannot be modified at this time`

I am having an issue with updating a file using fs and then creating a zip in a different location. The file update seems to be working fine, but the zip file does not have the updated contents. Can someone point out what I am doing wrong in my code belo ...

Using JSP to send variables from an external Javascript file

After creating a timer function, I am looking to display the results on a different page. The setup involves a JSP file calling functions from a separate JS file in order to output the information to another screen: Instructions in the JSP file: <butt ...

Determine the number of values in a table record when using ng-hide and ng-show

I am working on displaying rows with the sum of column values using ng-hide and ng-show. The display depends on three conditions: 1) auto 2) live 3) autolive (combination of auto and live when not present in json) Summary: If siteData.jobType==toggleV ...

w2ui failing to recognize input from HTML form

w2ui seems to be ignoring the input tag's value attribute. How can I make it use the specified value? It works fine with selects. https://i.sstatic.net/pNSey.png Check out the jsfiddle link for more information <div id="form" style="width: 750 ...

The React Fabric TextField feature switches to a read-only mode once the value property is included

I've been grappling with how to manage value changes in React Fabric TextFields. Each time I set the value property, the component goes into read-only mode. When utilizing the defaultValue property, everything functions correctly, but I require this i ...

The enigmatic void nestled amidst two dividers

I designed a layout with two buttons beside a progress bar, where the buttons are enclosed within a <div> element: <div class="block"> <div class="progress progress-striped active"> <div class="progress-bar" role="progress ...

I am interested in having the push notification feature function specifically for registered users

In an attempt to register the device for push notification using the PhoneGap plugin, I am encountering an issue. After the AJAX success action is called, the registration action does not alert the registration ID. Can someone help figure out what's g ...

Numerous asynchronous AJAX requests accompanied by various loading indicators

My ASP.net MVC page is utilizing ajax calls to load data for each of the six divs. To handle the loading indicator, I have created two methods as shown below. $("#divId").loading(); $("#divId").stopLoading(); Here is an example of one of my ajax calls ( ...

How to trigger a mouse click event in a ReactJS environment

I am working on a project where I need to simulate a click (on the first item in a collapsed list) automatically without requiring any user interaction. The list collapsing feature is implemented using Material UI. Any suggestions or ideas would be great ...

Creating a Website for Compatibility with NoScript

During my journey of building a nameplate site from the ground up for myself, I have delved into the realms of learning and establishing my online presence. The highlight of my project is a sleek tabbed site that employs AJAX and anchor navigation to seaml ...

How can I retrieve an image from a library and automatically update the image in SharePoint every 30 seconds?

I have a web part and I have written the code below: However, it is only fetching one image. How can I fetch all images from the library and change the image every 30 seconds using JavaScript or jQuery? public class MSDN : System.Web.UI.WebControls.WebPa ...

I am looking to optimize my WordPress posts to load in increments as the user scrolls down the page, similar to how Facebook does

I am looking to implement a feature on my WordPress post where the content loads a few at a time as the user scrolls, similar to Facebook. Specifically, I would like my webpage to automatically load 10 posts and then continue loading 10 more as the user re ...

Issue with reading initial state value in React application

I'm currently working on an application centered around payment recording functionality. Within my app, there is a state structure that looks something like this: const [state, setstate] = useState({ amountPaid: Number(bill.total), // the 'b ...

Accept only numerical values and special characters, excluding all alphabets

In my textbox, I want to restrict the entry of alphabets and only allow numbers and special characters. I attempted to use the following JavaScript code, but it doesn't seem to be working... <script type="text/javascript"> //Function to on ...

Streamline your processes by automating jQuery AJAX forms

I am looking to automate a click function using the code snippet below in order to directly submit form votes. Is there a method to develop a standalone script that can submit the votes without requiring a webpage refresh: <input type="submit" id="edit ...