Подключение Датрики к React

В проекте на Vite или Create React App достаточно вставить скрипт в index.html.

Замените YOUR_SITE_ID на ID сайта в Датрике. Скрипт с уже подставленным ID можно скопировать в настройках сайта на вкладке «Общее».

Вставка скрипта

Вставьте скрипт в <head> файла index.html в корне проекта. В Create React App этот файл лежит в папке public.

index.html

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>My React app</title>
    <script defer
      src="https://cdn.datrika.app/da.js"
      data-datrika
      data-site-id="YOUR_SITE_ID">
    </script>
  </head>
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.tsx"></script>
  </body>
</html>

Обычные переходы между страницами приложения Датрика отслеживает сама. Не видит она только переходы через router.replace, которые заменяют адрес, а не добавляют новый, и роутинг через # в адресе.

Готово? Откройте сайт в браузере. Мастер в Датрике сам заметит первый визит и откроет дашборд.