Frequently Asked Questions

I can't use the open-in-editor feature

The feature is based on the vite-plugin-vue-inspector plugin and requires configuration, which you can do by looking at the configuration documentation.

How can I specify the editor for open-in-editor feature?

Starting from v7.2.0, you can specify the editor by launchEditor option:

This is a list of supported editors, please ensure that the editor's environment variables are correctly configured beforehand.

import VueDevTools from 'vite-plugin-vue-devtools'
export default defineConfig({
  plugins: [
    VueDevTools({
      launchEditor: 'webstorm',
    }),
    Unocss(),
  ],
})

How to work with Laravel Vite Plugin?

import { defineConfig } from 'vite'
import laravel from 'laravel-vite-plugin'
import VueDevTools from 'vite-plugin-vue-devtools'

export default defineConfig({
  plugins: [
    VueDevTools({
      appendTo: 'resources/js/app.js'
    }),
    laravel([
      'resources/js/app.js',
    ]),
  ],
})

How to work with Nuxt3? (v7.1.3+)

Recommendation

We still recommend using Nuxt DevTools for a better development experience.

// nuxt.config.ts

export default defineNuxtConfig({
  vite: {
    plugins: [
      VueDevTools({
        appendTo: /\/entry\.m?js$/,
      })
    ]
  }
})