---
title: "Nuxt Integration · Unlighthouse"
canonical_url: "https://unlighthouse.dev/integrations/nuxt"
last_updated: "2026-02-27T02:31:30Z"
meta:
  description: "Integrate Lighthouse audits directly into your Nuxt development workflow with automatic route discovery."
  "og:description": "Integrate Lighthouse audits directly into your Nuxt development workflow with automatic route discovery."
  "og:title": "Nuxt Integration · Unlighthouse"
---

Star Unlighthouse on GitHubUnlighthouse on GitHub

[**User Guide **](https://unlighthouse.dev/guide/getting-started/installation)

[**Integrations **](https://unlighthouse.dev/integrations/cli)

[**API **](https://unlighthouse.dev/api-doc/config)

**Integrations**

# **Nuxt Integration**

[Copy for LLMs](https://unlighthouse.dev/integrations/nuxt.md)

**Deprecated**: This integration will be removed in v1.0. Use [**~~CLI~~**](https://unlighthouse.dev/integrations/cli) or [**~~CI~~**](https://unlighthouse.dev/integrations/ci) instead. See [**~~deprecation notice~~**](https://unlighthouse.dev/integration-deprecations).

Lighthouse auditing during Nuxt development with automatic route discovery and HMR support.

## Install

```bash
yarn add -D @unlighthouse/nuxt
```

### Git ignore reports

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

```shell
.unlighthouse
```

## Usage

To begin using Unlighthouse, you'll need to add the module to `**buildModules**`.

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

### Nuxt 3

```js
import { defineNuxtConfig } from 'nuxt3'

export default defineNuxtConfig({
  modules: [
    '@unlighthouse/nuxt',
  ],
})
```

### Nuxt 2

```js
export default {
  buildModules: [
    '@unlighthouse/nuxt',
  ],
}
```

Type support can be added by adding the `**@unlighthouse/nuxt**` module to your `**plugins**`. Nuxt v3 will automatically add type support.

```json
{
  "compilerOptions": {
    "types": [
      "@unlighthouse/nuxt"
    ]
  }
}
```

## Configuration

You can either configure Unlighthouse via the `**unlighthouse**` key in your Nuxt config, or you can provide a `**unlighthouse.config.ts**` file in the root directory.

### Example

```js
export default {
  unlighthouse: {
    scanner: {
      // simulate a desktop device
      device: 'desktop',
    }
  }
}
```

[Edit this page](https://github.com/harlan-zw/unlighthouse/edit/main/docs/2.integrations/3.nuxt.md)

[Markdown For LLMs](https://unlighthouse.dev/integrations/nuxt.md)

**Did this page help you? **

Anything that could be done better? :)

Help us improve this page. You can [~~edit this page ~~](https://github.com/harlan-zw/unlighthouse/edit/main/docs/2.integrations/3.nuxt.md) on GitHub or provide anonymous feedback below.

### **Related **

[**CLI Integration**](https://unlighthouse.dev/integrations/cli) [**Deprecation Notice**](https://unlighthouse.dev/integration-deprecations) [**Configuration**](https://unlighthouse.dev/guide/guides/config)

[**CI/CD** Run unlighthouse-ci on every deploy. Auto-discovers every URL, runs Lighthouse on all of them in parallel, enforces a single budget. Works in GitHub Actions, GitLab CI, any pipeline.](https://unlighthouse.dev/integrations/ci) [**Vite** Integrate Lighthouse audits into your Vite development server with automatic route discovery and HMR support.](https://unlighthouse.dev/integrations/vite)

**On this page **

- [Install](#install)
- [Usage](#usage)
- [Configuration](#configuration)