'How to add Google Analytics tracking ID in svelte

I want to add my Google Analytics Tracking ID- UA-XXXXXXXXX-X to my svelte app.

I found two ways of doing it.

First using Install the global site tag here

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=GA_MEASUREMENT_ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){window.dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'GA_MEASUREMENT_ID');
</script>

I think, I have to insert the above code in app.svelte. Am I right?

Second, using @beyonk/svelte-google-analytics

Installing package using

npm i --save-dev @beyonk/svelte-google-analytics

import { GoogleAnalytics } from '@beyonk/svelte-google-analytics'

<GoogleAnalytics properties={[ 'google property id A', ...'google property id X' ]} />

So where here am I suppose to add tracking ID? This is how it is mentioned in svelte documentation here

The first or the second method to use? This is confusing



Solution 1:[1]

You can add the global site tag within public/index.html. All of your Svelte will be injected into this file, so it will handle all of your pages.

Solution 2:[2]

To insert multiline html into .svelte file:

{@html `<!-- google tag analytics goes here -->
<!-- ... -->
<!-- / -->`}

or you can insert code into app.html

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Samuel Anozie
Solution 2 Lex