DevTools

Category	Debugging
Dependencies	@vue/devtools-api
Bundle size	0.08 kB

Vue DevTools form inspector plugin for Vueform (development-only).

Installation

npm

npm install -D @vueform/devtools

pnpm

pnpm add -D @vueform/devtools

yarn

yarn add -D @vueform/devtools

bun

bun add -D @vueform/devtools

import { createVueform } from '@vueform/ui'
import devtools from '@vueform/devtools'

createVueform({
  plugins: [devtools()], 
})

Usage

Registering the plugin adds a Vueform inspector to Vue DevTools. Every mounted form appears in it with its element tree and live state — model, errors, dirty/invalid/validated flags, submit results — refreshing as the form changes.

The plugin is development-only by design. Production builds drop the module — the inspector and @vue/devtools-api included — from the bundle entirely, so it's safe to register unconditionally. To turn the inspector off in development too, set devtools: false in the config.

Source

packages/devtools