[Error] GA4React is being initialized

[hashimwebsul]

i am trying to send pageview but i get this error when i am navigating to any page

useEffect(() => { const ga4react = new GA4React('G-1JXXXXX'); ga4react.initialize().then((ga4) => { ga4.pageview(location.path + location.search) }, (err) => { console.log('error sending page view', err) }) }, [location])

[unrealmanu]

You should only initialize ga-4-react once, so every react life cycle, you restart it, it's not allowed.

I'll give you an example to start it uniquely and then reuse it:

import React from "react";
import ReactDOM from "react-dom";
import GA4React, { useGA4React } from "ga-4-react";

const ga4react = new GA4React("G-1JXXXXX");

function MyApp() {
  const ga = useGA4React();
  console.log(ga);

  return <div className="App">hi!</div>;
}

(async () => {
  await ga4react.initialize();

  ReactDOM.render(
    <React.StrictMode>
      <MyApp />
    </React.StrictMode>,
    document.getElementById("root")
  );
})();

[unrealmanu]

otherwise, let the library start by itself:

import React from "react";
import ReactDOM from "react-dom";
import { useGA4React } from "ga-4-react";

function MyApp() {
  const ga = useGA4React("G-1JXXXXX");
  console.log(ga);

  return <div className="App">hi!</div>;
}

ReactDOM.render(
  <React.StrictMode>
    <MyApp />
  </React.StrictMode>,
  document.getElementById("root")
);