网页
综合
更新时间 2026-11-13 17:03:59
@nuxt/devtools · Nuxt Modules
自动蜘蛛
nuxt.com
正文约 2578 字
Nuxt DevTools shows you how your Nuxt app is put together: its pages, components, auto-imports, modules, server routes, payloads and configuration. It lives as a Nuxt group inside the Vite DevTools panel, next to Vue DevTools, Inspect, Terminals and the tools your other Vite plugins provide.
Nuxt DevTools v4 needs Vite 8, so Nuxt 5, or Nuxt 4.5 or later. Nuxt 4.0–4.4 ship Vite 7 and cannot run it; see Upgrading to v4 if you are coming from v3.
Nuxt 5 ships @nuxt/devtools-onboard, a tiny module that loads Nuxt DevTools when it is installed. The first time you run nuxt dev without it, a floating button offers to install @nuxt/devtools with your package manager and restarts the dev server. Each install waits for you to confirm it in the terminal running nuxt dev.
You can also install it yourself:
Nuxt 4 still bundles DevTools v3. Override the bundled version with your package manager, then reinstall:
Remove your lockfile (package-lock.json, yarn.lock, or pnpm-lock.yaml) and install again so the override takes effect.
DevTools is enabled by default in development, and nothing is injected in production. To turn it off, set enabled to false:
Run nuxt dev and open your app in the browser. Click the Nuxt button in the Vite DevTools dock at the bottom of the page, or press Shift + Alt / ⇧ Shift + ⌥ Option + D, to toggle the panel.
Vite DevTools can run commands and read files on your machine, so the first time you open it, it asks you to authorize the browser with the code printed in the terminal running nuxt dev. The prompt is skipped in sandboxes such as StackBlitz and CodeSandbox. To skip it elsewhere, set devtools.disableAuthorization: true; only do this on a machine you trust, as any browser that reaches the dev server then gets access.
Configure Nuxt DevTools with the devtools key of your nuxt.config:
For every option, see the TSDocs in your IDE or the type definition file.
Similar to Nuxt's Nightly Channel, DevTools also offers a nightly release channel, that automatically releases for every commit to the main branch.
On Nuxt 5, install it next to your app's dependencies; it takes precedence over @nuxt/devtools:
If your nuxt.config lists @nuxt/devtools in modules, replace it with @nuxt/devtools-nightly.
On Nuxt 4, alias it with your package manager's overrides:
Remove your lockfile (package-lock.json, yarn.lock, or pnpm-lock.yaml) and reinstall dependencies.
Discover everything Nuxt DevTools shows you about your Nuxt app.
Stay updated on new releases and features, guides, and community updates.
Copyright © 2016-2026 Nuxt - MIT License
本页为82搜索生成的网页快照,内容来自站内索引;演示数据的原文链接仅作示例。