Vue
The methods are the same as on any website. The full reference is JavaScript (w.js).
Install
Put the script in the head of index.html, once for the whole app:
<script async src="https://YOUR_ORIGIN/w.js" data-site="YOUR_SITE_KEY"></script>Initialize
The script starts in the browser. Do not inject it again from setup. When Vue Router uses browser history, each URL change becomes a pageview. For hash mode, add data-hash="true" on that same tag.
Pageviews
The first load and later route changes are sent by default. If you set data-auto-track="false", call webcount.pageview() after the route finishes. See Pageviews & SPAs.
Events
webcount.track('purchase', { revenue: 19.9 });Names are at most 100 characters, and at most 20 properties are kept. Keys are cut at 50 characters and string values at 200. In a composable, check that webcount exists before you call it.
Identity
After sign-in, call webcount.login. The method appears only after the identity script loads. See JavaScript (w.js).
webcount.login(userId, { plan: 'pro' }, { type: 'login' });Limits
| Item | Default | What it means |
|---|---|---|
| Installs | Once | A script injected again from a component is ignored |
| Localhost | Skipped | Local previews are not sent |
| Properties | 20 | Extra keys are dropped. Object values are dropped; only strings, numbers, and booleans remain |
Errors
If the dev server shows no request, confirm data-site is the site key from the console and that the browser is not sending Do Not Track. Once webcount.siteKey exists, the script returns, so inserting it again during hot reload does not replay startup. Hash routes without data-hash="true" on the tag do not create a new pageview. login is missing until the identity script arrives, so check for it before you call. Checking storage is in Verify your installation.
Nuxt
The methods are the same as on any website. The full reference is JavaScript (w.js).
Install
Put this line in the head of app.html, once for the site:
<script async src="https://YOUR_ORIGIN/w.js" data-site="YOUR_SITE_KEY"></script>Initialize
After the document loads, the script sends the first pageview itself. Client routes that use browser history are sent automatically. For hash routing, add data-hash="true" on the same tag.
Pageviews
The first document and later client navigations are covered by default. After you turn autocapture off, call webcount.pageview() when the route finishes. See Pageviews & SPAs.
Events
webcount.track('purchase', { revenue: 19.9 });Event names are at most 100 characters, with at most 20 properties. Keys are cut at 50 characters and string values at 200. Call it from a click handler, not from server middleware.
Identity
Call this only in the browser, after sign-in. login waits for the identity script. See JavaScript (w.js).
webcount.login(userId, undefined, { type: 'login' });Limits
| Item | Default | What it means |
|---|---|---|
| Where it runs | Browser | Server rendering has no webcount |
| Installs | Once | Do not inject the script again from a page component |
| Localhost | Skipped | Local previews are not sent |
Errors
Collection requests do not show up in server logs. Watch the browser network panel, then confirm storage with Verify your installation. If a layout prints the app.html tag a second time, the existing webcount.siteKey ignores it. Calling webcount from a server plugin fails because the object is not there. Keep the call on the client. Hash routes need data-hash="true" on the same tag, or you only see the first document. login never appears when identify mode is off.
React
Components only call the existing webcount object. The methods are the same as on any website; the full reference is JavaScript (w.js).
Install
<script async src="https://YOUR_ORIGIN/w.js" data-site="YOUR_SITE_KEY"></script>Place that line in index.html. Do not create another script node while a component renders.
Initialize
The script starts itself. Routers that use browser history send a pageview when the URL changes. Hash routing needs data-hash="true" on the same tag.
Pageviews
The first load and later history changes are sent by default. With autocapture off, call webcount.pageview() when the route finishes. See Pageviews & SPAs.
Events
webcount.track('purchase', { revenue: 19.9 });Properties are strings, numbers, or booleans, at most 20 of them. Keys are cut at 50 characters and string values at 200. A call with an empty event name is dropped.
Identity
webcount.login(userId, { plan: 'pro' }, { type: 'login' });Call it from the sign-in success path. login comes from the identity script. See Identify users.
Limits
| Item | Default | What it means |
|---|---|---|
| Strict mode | Repeat is ignored | A second script insert does not create another instance |
| Event name | 100 characters | The rest is cut |
| Localhost | Skipped | Local hostnames are not sent |
Errors
If webcount is missing at the call site, the script has not run yet or data-site is absent. Hash routes without data-hash="true" keep only the first pageview. Extra properties beyond 20, or object values, are dropped, and the call itself does not throw. login never appears when identify mode is off. Local development is skipped by default, which is easy to read as a failed install. See Verify your installation.
Next.js
Server components and server actions have no webcount. The methods are the same as on any website; the full reference is JavaScript (w.js).
Install
Once, in the head of the root layout:
<script async src="https://YOUR_ORIGIN/w.js" data-site="YOUR_SITE_KEY"></script>Do not print that tag again from a page component.
Initialize
After the browser loads the script, it sends the first pageview. Client navigations in the app router use browser history, so later pageviews are sent automatically.
Pageviews
The first document and later client navigations are included by default. To send them yourself, set data-auto-track="false" on the script, then call webcount.pageview(). See Pageviews & SPAs.
Events
webcount.track('purchase', { revenue: 19.9 });Call it from a browser event. Names are at most 100 characters, with at most 20 properties. Keys are cut at 50 characters and string values at 200. Objects and arrays are not kept as properties.
Identity
Call this on the client after sign-in. The method comes from the identity script; do not assume login exists before it loads.
webcount.login(userId, { plan: 'pro' }, { type: 'login' });Limits
| Item | Default | What it means |
|---|---|---|
| Where it runs | Browser | Do not call it during server rendering |
| Tags | One | The root layout is enough |
| Localhost | Skipped | Local development is not sent |
Errors
Seeing no collect request in the server terminal is expected. In the browser, confirm the script and data-site, then check storage with Verify your installation. If the root layout and a server component each print the tag, the second copy is ignored, but you should still keep a single tag. Calling webcount.track from a server action fails. If a client navigation only changes the hash, add data-hash="true" on the same tag.