Skip to content
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
36 changes: 11 additions & 25 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,17 @@ Nuxt Hints integrates directly into the Nuxt DevTools, giving you actionable ins

- [✨Release Notes](/CHANGELOG.md)

## Getting Started

To install and add the module, you can run the following command:

```bash
npx nuxt module add hints
```

The module is now automatically installed and added to your `nuxt.config.ts`.
Now you can open your Nuxt app, go to the DevTools, and click the Nuxt Hints icon to get started.

## Features

- **πŸš€ Rich DevTools UI**: A dedicated tab in Nuxt DevTools to visualize issues, inspect elements, and get recommendations.
Expand Down Expand Up @@ -50,31 +61,6 @@ Analyze all third-party scripts on your page. The dashboard shows loading times,

![hints devtools third-party screenshot](./.github/assets/devtools-thirdparties.png)

## Quick Setup

1. Add `@nuxt/hints` dependency to your project:
```bash
# Using pnpm
pnpm add -D @nuxt/hints

# Using yarn
yarn add --dev @nuxt/hints

# Using npm
npm install --save-dev @nuxt/hints
```

2. Add `@nuxt/hints` to the `modules` section of `nuxt.config.ts`:
```js
export default defineNuxtConfig({
modules: [
'@nuxt/hints'
]
})
```

That's it! Open your Nuxt app, go to the DevTools, and click the Nuxt Hints icon to get started.

## How It Works

### Performance Monitoring
Expand Down
Loading