Error monitoring for Lovable apps

Know when your Lovable app breaks — in plain English, before your users email you.

The fast way: ask your AI tool

You built this by chatting with Lovable, so let Lovable do the install too.

Paste this into your chat
Install Vigil error monitoring in this app. Follow the instructions at https://vigill.dev/skill?key=vg_pub_YOUR_KEY exactly, then confirm installation succeeded.

It will work out where the snippet goes, put it there, and check that it worked. If it gets stuck, the instructions tell it how to recover.

The manual way

Paste this in the <head> of your app’s main HTML file — usually index.html, then redeploy.

index.html — html
<script src="https://vigill.dev/v.js" data-vigil-key="vg_pub_YOUR_KEY"></script>

This key is meant to be public — it can only send errors in, never read anything out. Do not move it into an environment variable; static hosts have nothing to read one back at runtime.

When a React component throws while rendering, React removes the whole page and the browser never reports it. Wrapping your app catches those, and shows your users a message instead of a white screen.

App.tsx — tsx
import { VigilErrorBoundary } from '@vigil/react';
export default function App() {
  return (
    <VigilErrorBoundary>
      <YourApp />
    </VigilErrorBoundary>
  );
}

What happens next

Load your app once in a browser. Within a minute your dashboard confirms vigill.dev is watching. After that, if something breaks, you get an email that explains what happened in plain English — and a prompt you can paste straight back into Lovable to fix it.

The fast way: ask your AI tool

You built this by chatting with Lovable, so let Lovable do the install too.

Paste this into your chat

Install Vigil error monitoring in this app. Follow the instructions at https://vigill.dev/skill?key=vg_pub_YOUR_KEY exactly, then confirm installation succeeded.

It will work out where the snippet goes, put it there, and check that it worked. If it gets stuck, the instructions tell it how to recover.

The manual way

Paste this in the <head> of your app’s main HTML file — usually index.html, then redeploy.

index.html — html

<script src="https://vigill.dev/v.js" data-vigil-key="vg_pub_YOUR_KEY"></script>

This key is meant to be public — it can only send errors in, never read anything out. Do not move it into an environment variable; static hosts have nothing to read one back at runtime.

What happens next