net::ERR_UNKNOWN_URL_SCHEME Vue.js devtools (beta) 7.0.0 beta 3 in Ionic App #504
Description
Hi, the error appears if I try to inspect remotely the Webview of my Ionic-Vue app from chrome://inspect/#devices.
package.json:
"dependencies": {
"@capacitor/android": "^6.1.0",
"@capacitor/app": "6.0.0",
"@capacitor/core": "6.1.0",
"@capacitor/haptics": "6.0.0",
"@capacitor/keyboard": "6.0.1",
"@capacitor/status-bar": "6.0.0",
"@ionic/vue": "^8.0.0",
"@ionic/vue-router": "^8.0.0",
"axios": "^1.7.2",
"croppie": "^2.6.5",
"flowbite": "^2.3.0",
"ionicons": "^7.0.0",
"pinia": "^2.1.7",
"sweetalert2": "^11.11.1",
"swiper": "^11.1.4",
"toastr": "^2.1.4",
"vanilla-lazyload": "^19.1.3",
"vue": "^3.3.0",
"vue-router": "^4.2.0",
"vue3-nl2br": "^0.1.5"
},
"devDependencies": {
"@capacitor/cli": "6.1.0",
"@vitejs/plugin-legacy": "^5.0.0",
"@vitejs/plugin-vue": "^4.0.0",
"@vue/eslint-config-typescript": "^12.0.0",
"@vue/test-utils": "^2.3.0",
"autoprefixer": "^10.4.19",
"cypress": "^13.5.0",
"eslint": "^8.35.0",
"eslint-plugin-vue": "^9.9.0",
"jsdom": "^22.1.0",
"postcss": "^8.4.38",
"sass": "^1.77.5",
"tailwindcss": "^3.4.4",
"terser": "^5.4.0",
"typescript": "^5.1.6",
"vite": "~5.2.0",
"vite-plugin-vue-devtools": "^7.3.5",
"vitest": "^0.34.6",
"vue-tsc": "^1.0.24"
},
vite.config.ts:
/// <reference types="vitest" />
import legacy from "@vitejs/plugin-legacy";
import vue from "@vitejs/plugin-vue";
import path from "path";
import { defineConfig } from "vite";
import vueDevTools from "vite-plugin-vue-devtools";
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue(), legacy(), vueDevTools()],
resolve: {
alias: {
"@": path.resolve(__dirname, "./src"),
},
},
test: {
globals: true,
environment: "jsdom",
},
build: {
sourcemap: true,
},
});
In the inspect window of Chrome I can see the Vue tab but it keeps showing the Vue logo, and in console I get the error:
/// <reference types="vitest" />
import legacy from "@vitejs/plugin-legacy";
import vue from "@vitejs/plugin-vue";
import path from "path";
import { defineConfig } from "vite";
import vueDevTools from "vite-plugin-vue-devtools";
// https://vitejs.dev/config/
export default defineConfig({
plugins: [vue(), legacy(), vueDevTools()],
resolve: {
alias: {
"@": path.resolve(__dirname, "./src"),
},
},
test: {
globals: true,
environment: "jsdom",
},
build: {
sourcemap: true,
},
});