'ReferenceError: dataLayer is not defined

So, I'm attempting to setup google analytics with the provided code as follows:

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

      gtag('config', 'my-id');
    </script>
  </Head>

but am receiving the above mentioned error message. What am I overlooking here?

The generated stack trace reads as follows:

Uncaught ReferenceError: dataLayer is not defined
    at Meta (VM79 _app.js.eb2961df9cc079665d85.hot-update.js:24)
    at renderWithHooks (VM47 react-dom.development.js:12938)
    at mountIndeterminateComponent (VM47 react-dom.development.js:15020)
    at beginWork (VM47 react-dom.development.js:15625)
    at performUnitOfWork (VM47 react-dom.development.js:19312)
    at workLoop (VM47 react-dom.development.js:19352)
    at HTMLUnknownElement.callCallback (VM47 react-dom.development.js:149)
    at Object.invokeGuardedCallbackDev (VM47 react-dom.development.js:199)
    at invokeGuardedCallback (VM47 react-dom.development.js:256)
    at replayUnitOfWork (VM47 react-dom.development.js:18578)
    at renderRoot (VM47 react-dom.development.js:19468)
    at performWorkOnRoot (VM47 react-dom.development.js:20342)
    at performWork (VM47 react-dom.development.js:20254)
    at performSyncWork (VM47 react-dom.development.js:20228)
    at requestWork (VM47 react-dom.development.js:20097)
    at scheduleWork (VM47 react-dom.development.js:19911)
    at scheduleRootUpdate (VM47 react-dom.development.js:20572)
    at updateContainerAtExpirationTime (VM47 react-dom.development.js:20600)
    at updateContainer (VM47 react-dom.development.js:20657)
    at ReactRoot.render (VM47 react-dom.development.js:20953)
    at legacyRenderSubtreeIntoContainer (VM47 react-dom.development.js:21105)
    at Object.render (VM47 react-dom.development.js:21155)
    at renderReactElement (VM39 main.js:8591)
    at _temp11 (VM39 main.js:8275)
    at doRender (VM39 main.js:8316)
    at VM39 main.js:8374
    at _catch (VM39 main.js:8239)
    at _temp6 (VM39 main.js:8373)
    at render (VM39 main.js:8392)
    at VM39 main.js:8534
    at VM39 main.js:5985
    at Set.forEach (<anonymous>)
    at Set.<anonymous> (VM39 main.js:1675)
    at Router.notify (VM39 main.js:5984)
    at Router.update (VM39 main.js:5489)
    at VM36 _app.js:53429
    at hotApply (VM37 webpack.js:681)
    at VM37 webpack.js:363

google-analytics

Solution 1:^[1]

You have to paste inside this, { }

<script>
 {` window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'my-id');`}
</script>

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	Geethapriya Arulanandhan

'ReferenceError: dataLayer is not defined

Solution 1:[1]

Sources

Related Questions

Solution 1:^[1]