Install Chartsy on a React or Vue single-page app
Add the script to index.html. Route changes need nothing extra.
1Add the script to index.html
Copy your snippet from Growth Attribution in the Chartsy sidebar: step 1 of Set up tracking has it with your site's public key, which is safe to expose:
A single-page app has one HTML file that every route renders into - put the snippet in its <head>. That's index.html at the project root for Vite (React, Vue, Preact, Solid), or public/index.html for Create React App.
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Your app</title>
<script async src="https://chartsy.fra1.digitaloceanspaces.com/production/static/track.js"
data-key="ch_pk_..."
data-api="https://dashboard.chartsy.app/api/attribution"></script>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>Don't load it from a component: it only needs to run once per page load, and route changes need nothing extra - Chartsy counts one visit per session.
Visits, sources and signups are fully tracked. The one thing client-side navigation leaves out is the "pages before signup" journey, which only includes full page loads.
2Check it worked
Open your deployed site in a private window, then in Chartsy go to Settings → Domains and click View setup checklist on the site's row. "Add tracking snippet" flips to done as soon as the first visit lands - it is inferred from real traffic, so it confirms the snippet is firing, not just pasted.
Nothing arriving? View the page source and confirm the <script> tag is there with your real key. A blank or placeholder key is the most common cause.
Testing locally records nothing: the script ignores localhost and private IP addresses. Automated browsers (Playwright, Puppeteer, Selenium, headless Chrome) are ignored too, so automated tests won't show up in your reports.
3Track signups
The script now records where each visitor came from. To see which channels bring signups - and later revenue - tell Chartsy who signed up.
Other stacks: see all signup tracking guides.
