diff --git a/packages/devtools-kit/src/core/index.ts b/packages/devtools-kit/src/core/index.ts index 9bde0f87..10cf3d17 100644 --- a/packages/devtools-kit/src/core/index.ts +++ b/packages/devtools-kit/src/core/index.ts @@ -43,6 +43,21 @@ export function initDevTools() { } } + // @ts-expect-error skip type check + // Vue2 app detection + target.__VUE_DEVTOOLS_GLOBAL_HOOK__.once('init', (Vue) => { + console.log('%c[_____Vue DevTools v7 log_____]', 'color: red; font-bold: 700; font-size: 20px;') + + console.log('%cVue DevTools v7 detected in your Vue2 project. v7 only supports Vue3 and will not work.', 'font-bold: 700; font-size: 16px;') + + const url = 'https://chromewebstore.google.com/detail/vuejs-devtools/iaajmlceplecbljialhhkmedjlpdblhp' + console.log(`%cThe legacy version that supports both Vue 2 and Vue 3 has been moved to %c ${url}`, 'font-size: 16px;', 'text-decoration: underline; cursor: pointer;font-size: 16px;') + + console.log('%cPlease install and enable only the legacy version for your Vue2 app.', 'font-bold: 700; font-size: 16px;') + + console.log('%c[_____Vue DevTools v7 log_____]', 'color: red; font-bold: 700; font-size: 20px;') + }) + hook.on.setupDevtoolsPlugin((pluginDescriptor, setupFn) => { addDevToolsPluginToBuffer(pluginDescriptor, setupFn) const { app } = activeAppRecord ?? {}