Skip to main content
ReadMeter
Buy · $9

Vite

ReadMeter works with any Vite-based app (React, Vue, Svelte, etc.). The installer injects the widget into your HTML entry file.

Quick setup

From your Vite project folder, run:

readmeter add

The installer copies the widget to public/readmeter-widget.js and adds a script tag to your index.html.

Manual setup

If the installer doesn't find your HTML, add the script tag before your app script:

<!-- index.html -->
<!DOCTYPE html>
<html>
  <head>
    <script src="/readmeter-widget.js"></script>
  </head>
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.tsx"></script>
  </body>
</html>

Modular Firebase SDK (v9+)

The installer adds a small Vite plugin that sends getDoc, getDocs and onSnapshot through the ReadMeter wrapper in every file, including .vue and .svelte components, so files you add later are tracked too. It also rewrites your existing imports, which look like this:

import { getDoc, getDocs, onSnapshot } from './lib/readmeter-firestore'
import { collection, doc, query, where } from 'firebase/firestore'

Next steps