Install the Subtext Snippet in Your Vite Application

Vite projects use an index.html at the project root as their application entry point — unlike Create React App, this file lives at the top level rather than inside public/. Pasting the Subtext capture snippet into its <head> is all you need to start recording sessions across your entire application.

You can also run npx @subtextdev/subtext-wizard in your project root to have Subtext detect your framework and insert the snippet automatically. Follow this guide if you prefer to wire things up by hand.

Find your Org ID

Log in to Subtext and open Settings. Your Org ID is listed in the Capture section. Copy it — you will paste it in place of YOUR_ORG_ID in the snippet below.

Open index.html at the project root

Open the index.html file in the root of your Vite project (the same directory as vite.config.ts). Do not confuse this with any index.html files that may exist inside subdirectories.

Paste the snippet into the head

Add the snippet inside the <head> tag, just before the closing </head>. Replace YOUR_ORG_ID with the Org ID you copied from Subtext settings.

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 App</title>

    <!-- Subtext capture snippet -->
    <script>
      window['_fs_host'] = 'fullstory.com';
      window['_fs_script'] = 'edge.fullstory.com/s/fs.js';
      window['_fs_org'] = 'YOUR_ORG_ID';
      window['_fs_namespace'] = 'FS';
      !function(m,n,e,t,l,o,g,y){var s,f,a=function(h){return!(h in m)||(m.console&&m.console.log&&m.console.log('FullStory namespace conflict. More info: https://www.fullstory.com/developer/ns.html'),!1)};if(a(l)&&a(n)){m[l]={q:[]};var d=function(){return Array.prototype.slice.call(arguments,0)};m[l].identify=function(){m[l].q.push(["identify"].concat(d.apply(null,arguments)))};m[l].setUserVars=function(){m[l].q.push(["setUserVars"].concat(d.apply(null,arguments)))};m[l].event=function(){m[l].q.push(["event"].concat(d.apply(null,arguments)))};m[l].anonymize=function(){m[l].q.push(["anonymize"].concat(d.apply(null,arguments)))};m[l].shutdown=function(){m[l].q.push(["shutdown"].concat(d.apply(null,arguments)))};m[l].restart=function(){m[l].q.push(["restart"].concat(d.apply(null,arguments)))};m[l].log=function(a,b){m[l].q.push(["log",a,b])};m[l].consent=function(){m[l].q.push(["consent"].concat(d.apply(null,arguments)))};m[l].identifyAccount=function(){m[l].q.push(["identifyAccount"].concat(d.apply(null,arguments)))};m[l].clearUserCookie=function(){m[l].q.push(["clearUserCookie"].concat(d.apply(null,arguments)))};m[l].setVars=function(){m[l].q.push(["setVars"].concat(d.apply(null,arguments)))};m[l]._w={};y="XMLHttpRequest";m[l]._w[y]=m[y];y="fetch";m[l]._w[y]=m[y];if(m[y])m[l]._w[y]=m[y];m[l]._v="1.3.0";g=n.createElement(e);g.async=1;g.crossOrigin="anonymous";g.src='https://'+m[_fs_script];y=n.getElementsByTagName(e)[0];y.parentNode.insertBefore(g,y)}}(window,document,"script","_fs_config",n,o,g,y);
    </script>

  </head>
  <body>
    <div id="app"></div>
    <script type="module" src="/src/main.ts"></script>
  </body>
</html>

Vite treats index.html as the application entry point and processes it during both dev and build. The snippet will be included in your production build automatically — no extra configuration needed.

Run your dev server

Start Vite with npm run dev and open your application in a browser. The snippet loads asynchronously and does not block rendering.

Verify capture is working

Navigate to a few pages, then open Subtext → Sessions. A new session should appear within a minute or two.

Sessions typically appear within 30–60 seconds of page load. If nothing shows up, confirm that YOUR_ORG_ID was replaced with your actual Org ID and that you edited the index.html at the project root, not one inside src/ or public/.

The snippet records full production sessions and masks all form inputs by default. Your agent can flag additional PII and propose masking rules for your review from within Subtext.

Get Started

Install by Framework

Session Review

Privacy

Integrations

Recipes

API reference

Install the Subtext Snippet in Your Vite Application