Integrations

Vite Integration

Copy for LLMs
Deprecated: This integration will be removed in v1.0. Use CLI or CI instead. See deprecation notice.

Lighthouse auditing within your Vite dev environment with real-time performance feedback.

Install

yarn add -D @unlighthouse/vite

Git ignore reports

Unlighthouse will save your reports in outputDir (.unlighthouse by default), it's recommended you .gitignore these files.

.unlighthouse

Usage

To begin using Unlighthouse, you'll need to add the plugin to plugins.

When you run your Vite app, it will give you the URL of client, only once you visit the client will Unlighthouse start.

import Unlighthouse from '@unlighthouse/vite'
import { defineConfig } from 'vite'

export default defineConfig({
  plugins: [
    Unlighthouse({
      // config
    })
  ]
})

Providing Route Definitions

If you're using the vite-plugin-pages plugin, you can provide route definitions to Unlighthouse.

You will need to hook into the plugin using the following code.

import { useUnlighthouse } from 'unlighthouse'
import { defineConfig } from 'vite'

export default defineConfig({
  plugins: [
    Pages({
      // ...
      onRoutesGenerated(routes) {
        // tell Unlighthouse about the routes
        const unlighthouse = useUnlighthouse()
        if (unlighthouse?.hooks)
          unlighthouse.hooks.callHook('route-definitions-provided', routes)
      }
    }),
  ]
})

Configuration

You can either configure Unlighthouse via the plugin, or you can provide a config file file in the root directory.

Example

import Unlighthouse from '@unlighthouse/vite'
import { defineConfig } from 'vite'

export default defineConfig({
  plugins: [
    Unlighthouse({
      scanner: {
        // simulate a desktop device
        device: 'desktop',
      }
    })
  ]
})
Edit this page
Markdown For LLMs
Did this page help you?

Nuxt

Integrate Lighthouse audits directly into your Nuxt development workflow with automatic route discovery.

Webpack

Add Lighthouse auditing to webpack-based projects with development server integration and HMR support.