Sumidatasumidata.io
Sign in
Docs/Getting started/Install the SDK
Getting started · 2 min

Install the SDK

Two ways in: a CDN <script> tag for any HTML page, or the @sumidata/browser npm package for bundled apps (Vite, Vike, React, Next.js). Pick the tab that matches your stack — every page view, click, and error is captured automatically.

01Add Sumidata

Pick your stack, copy the snippet, ship it.

index.html
<!-- Sumidata SDK -->
<script>
  window.Sumidata = window.Sumidata || { push: function(m, a) { (this.q = this.q || []).push([m, a]) } };
</script>
<script
  src="https://sdk.sumidata.io/loader.js"
  data-project-id="YOUR_PROJECT_ID"
  data-src="https://sdk.sumidata.io/sumidata.js"
  async
></script>
i
CDN or npm? The HTML tab loads a ~2 KB loader from sdk.sumidata.io — zero build tooling. The other tabs install @sumidata/browser, which bundles the SDK into your app — no external script, CSP-friendly, and tree-shakeable. Both report to the same project.
1

Replace YOUR_PROJECT_ID

Find your project ID in the Dashboard under Settings → Project. It looks like proj_abc123xyz.

2

Deploy

Push the change to production. The SDK starts recording page views, clicks, scrolls, and errors immediately. If you're installing from the post-signup onboarding screen, it verifies the install live — it flips to "We received data from your site" as soon as the first event arrives; if it stays on "Listening…", check the Troubleshooting section below. Next step: Identify users so sessions stitch to known accounts.

02Troubleshooting

If the SDK doesn't seem to load, check these.

Content Security Policy

The npm package bundles the SDK into your app, so there's no extra origin to allow. If you use the CDN <script> tag under a strict CSP, add https://sdk.sumidata.io to script-src:

CSP header
Content-Security-Policy: script-src 'self' https://sdk.sumidata.io;

Ad blockers

Some ad blockers match on the word analytics or on common vendor domains. Sumidata's loader domain is generic enough to pass most filters, but if you see 0 events, check the browser Network tab for a blocked request. The npm package sidesteps this entirely — its requests come from your own origin.