-
|
Hi everyone, <html lang={locale}>
<Script async defer
src="/stats/script.js"
data-website-id="..."
/>
<body>
...
</body>
</html>and then I fire track event, but until umami is loaded I get an error that umami is not defined. I've end up doing a busy waiting code which look like this: export const track = (event?: string) => {
if (typeof umami !== 'undefined') {
console.log('tracking event', event);
if (event) {
umami.track(event);
} else {
umami.track();
}
} else {
console.log('umami not available, retrying event', event);
setTimeout(() => {
track(event);
}, 1000);
}
}Is there a neater way to achieve it? |
Beta Was this translation helpful? Give feedback.
Answered by
orendecor
Nov 11, 2024
Replies: 2 comments
-
|
Found a solution using strategy='beforeInteractive' and put the Script inside an tag: <html lang={locale}>
<head>
<Script
src='/stats/script.js'
data-website-id={websiteId}
strategy='beforeInteractive'
async
/>
</head>
...
</html>
``` |
Beta Was this translation helpful? Give feedback.
0 replies
Answer selected by
orendecor
-
|
Just adding an alternative way <script>
(function() {
let umamiReady = false;
const script = document.createElement('script');
script.async = true;
script.defer = true;
script.dataset.websiteId = '<UMAMI WEBSITE ID>';
script.src = '<UMAMI URL HOST SCRIPT>';
script.onload = function() {
// Add your tracking stuff here like this:
umami.track(props => ({ ...props, name: "my_custom_event" }));
};
script.onerror = function() {
console.error('Failed to load Umami script.');
};
document.head.appendChild(script);
})();
</script> |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Found a solution using strategy='beforeInteractive' and put the Script inside an tag: