I'm developing a new app in vue 3 with typescript.
I have the Vue Devtools installed in Chrome, but it refuses to recognize the app as a Vue app stating Vue.js not detected.
The help I find on the internet is to add Vue.config.devtools = true; to main.js. However Vue is not available in main.ts
I also find instructions to adapt the webpack configuration, but there's no webpack in the project (that was set up by vue-cli.
How to enable devtools in vue 3 with typescipt in development mode
Viewed 24014
4 Answers
I needed to do both and more.
1. Install the pluging for Vue 3
2. Enable devtools in config
And also, if you have both plugins for Vue 2 and Vue 3 installed, you have to disable one of them to get the Vue tab in the Developer Console working.
So, if you develop with Vue 3 right now, disable the plugin for Vue 2.
check on this issue https://github.com/vuejs/vue-devtools/issues/1244
Maybe adding this code to "main.ts" will help.
const app = Vue.createApp(App)
app.config.devtools = true
Adding to answers from Tolbxela and byungster:
I put this following command into main.ts:
app.config.performance = true;
instead of:
app.config.devtools = true;
'devtools' doesn´t exists in config anymore, its breaking typescript compiler.
Additional information: I needed restart browser and set off VueDevtools stable version.
Related