vite-plugin-vue-devtools
vite-plugin-vue-devtools copied to clipboard
[vite] Internal server error: Illegal tag name. Use '<' to print '<'.
Discussed in https://github.com/webfansplz/vite-plugin-vue-devtools/discussions/5
Originally posted by Stanzilla May 8, 2023 Hey there! First, thank you so much for making this plugin.
I've been trying to migrate our Vue + Vite + Electron app to it but getting the following error:
16:21:22.925 › App starting...
Illegal tag name. Use '<' to print '<'.
Illegal tag name. Use '<' to print '<'. (x2)
4:21:24 PM [vite] Internal server error: Illegal tag name. Use '<' to print '<'.
Plugin: vite-plugin-vue-inspector
File: /Users/stan/projects/personal/WeakAuras-Companion/src/components/LandingPage.vue?vue&type=script&lang.js
at createCompilerError (/Users/stan/projects/personal/WeakAuras-Companion/node_modules/@vue/compiler-core/dist/compiler-core.cjs.js:19:19)
at emitError (/Users/stan/projects/personal/WeakAuras-Companion/node_modules/@vue/compiler-core/dist/compiler-core.cjs.js:1613:29)
at parseChildren (/Users/stan/projects/personal/WeakAuras-Companion/node_modules/@vue/compiler-core/dist/compiler-core.cjs.js:959:21)
at Object.baseParse (/Users/stan/projects/personal/WeakAuras-Companion/node_modules/@vue/compiler-core/dist/compiler-core.cjs.js:858:23)
at parse (/Users/stan/projects/personal/WeakAuras-Companion/node_modules/@vue/compiler-dom/dist/compiler-dom.cjs.js:3119:25)
at result (/Users/stan/projects/personal/WeakAuras-Companion/node_modules/vite-plugin-vue-inspector/dist/index.cjs:65:51)
at new Promise (<anonymous>)
at compileSFCTemplate (/Users/stan/projects/personal/WeakAuras-Companion/node_modules/vite-plugin-vue-inspector/dist/index.cjs:62:24)
at TransformContext.transform (/Users/stan/projects/personal/WeakAuras-Companion/node_modules/vite-plugin-vue-inspector/dist/index.cjs:221:16)
at /Users/stan/projects/personal/WeakAuras-Companion/node_modules/vite-plugin-inspect/dist/index.cjs:878:32
I googled a bit and found threads were people were able to solve this but none of the solutions seemed to apply to us.
The code is here https://github.com/WeakAuras/WeakAuras-Companion/tree/devtools
Any idea as to what we are doing wrong?
Cheers!
Sorry, I didn't delve deeply into Electron. Tagging it hopes that someone can solve it.
Sorry, I didn't delve deeply into Electron. Tagging it hopes that someone can solve it.
Actually, should this bug be on the vite-plugin-vue-inspector repo?
Looks like this is a vue bug in general, wonder why it only now shows up with the inspector lib https://github.com/vitejs/vite/discussions/8476
It seems to be depending on indents some reason, sometimes the first is not fine but the second one is
<UIButton
v-if="result.size / 1024 > 16"
:class="{ spin: result.computing }"
@click="generate()"
type="issue"
>
<i
class="material-icons error"
v-if="result.size / 1024 > 16"
>error_outline</i
>
<UIButton v-if="result.size / 1024 > 16" :class="{ spin: result.computing }" @click="generate()" type="issue">
<i class="material-icons error" v-if="result.size / 1024 > 16">error_outline</i>
had the same issue in the setup function, even having the < in a comment was enough to trigger this issue.
The solution was to not use < operator, but instead the > operator