---
title: "Configuration"
description: "Configure Nuxt Hints and enable or disable each feature."
canonical_url: "https://nuxt.com/modules/hints/configuration"
---
# Configuration

> Configure Nuxt Hints and enable or disable each feature.

Configure the module in your `nuxt.config.ts` under the `hints` key:

```ts [nuxt.config.ts]
export default defineNuxtConfig({
  modules: ['@nuxt/hints'],
  hints: {
    devtools: true,

    // Enable or configure individual features
    // if you feel overwhelmed by logs, you can disable some features and fix things step by step.
    features: {
      // Defaults to true for each feature
      hydration: true,
    },
  },
})
```

## `devtools`

- Type: `boolean`
- Default: `true`

Adds the **Hints** tab to the Nuxt DevTools.

## `features`

Each feature is enabled by default and accepts either a **boolean** or an **object** for finer control:

| Key                                                                       | Description                                                                    |
| ------------------------------------------------------------------------- | ------------------------------------------------------------------------------ |
| [`hydration`](https://nuxt.com/modules/hints/hydration)                   | Detect and inspect hydration mismatches                                        |
| [`lazyLoad`](https://nuxt.com/modules/hints/lazy-load)                    | Flag unused imported components that could be lazy-loaded                      |
| [`webVitals`](https://nuxt.com/modules/hints/web-vitals)                  | Track LCP, INP, and CLS metrics                                                |
| [`thirdPartyScripts`](https://nuxt.com/modules/hints/third-party-scripts) | Audit third-party scripts for performance and security                         |
| [`htmlValidate`](https://nuxt.com/modules/hints/html-validate)            | Validate server-rendered HTML with [html-validate](https://html-validate.org/) |

When using the object syntax, the following flags are available:

```ts
{
  logs: true,       // Print warnings to the browser console
  devtools: true,   // Show this feature in the DevTools panel
  options: { ... }, // Feature-specific options
}
```

`logs` and `devtools` default to `true` when omitted. For example, to keep the hydration panel in the DevTools without the console warnings:

```ts [nuxt.config.ts]
export default defineNuxtConfig({
  hints: {
    features: {
      hydration: { logs: false },
    },
  },
})
```

The `options` accepted by each feature are described on its own page: [Web Vitals](https://nuxt.com/modules/hints/web-vitals#options), [Third-Party Scripts](https://nuxt.com/modules/hints/third-party-scripts#options) and [HTML Validation](https://nuxt.com/modules/hints/html-validate#options).


## Sitemap

See the full [sitemap](https://nuxt.com/sitemap.md) for all pages.
