Hi @JassonAlgo ,
I'm assuming multiple libraries in Launch mean multiple 3rd party vendor libraries in Launch.
You are looking to load these 3rd party libraries in a specific order.
If that's the case, @Anil_Umachigi 's response is probably the best way to ensure that loads.
How I do it is using JS Promises by doing a check and timeout that checks if the library has loaded.
Let's take the Facbeook pixel for example.
I would set up a promise that will:
1. Load the Facebook library
2. Check in the promise if "fbq" is available and put it in a timeout loop (let's say 2 seconds)
3. And then move on to the next item.
Not tested below but just an idea of how you can potentially do it. You would add more 'then()' at the end for your next libraries.
function loadFacebookPixel() {
if (typeof fbq === 'undefined') {
return new Promise(function(resolve, reject) {
var script = document.createElement('script');
script.src='https://connect.facebook.net/en_US/fbevents.js';
script.onload = function() {
setTimeout(function() {
if (typeof fbq === 'undefined') {
reject(new Error('Facebook Pixel not available after timeout'));
} else {
resolve(fbq);
}
}, 2000);
};
script.onerror = function() {
reject(new Error('Failed to load Facebook Pixel script'));
};
document.head.appendChild(script);
});
} else {
return Promise.resolve(fbq);
}
}
// Example usage:
loadFacebookPixel().then(function(fbq) {
if (typeof fbq !== 'undefined') {
fbq('track', 'PageView');
}
}).catch(function(error) {
console.error(error);
});
