Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Add `"jsx": "preserve"` in jsconfig.json for vue3 javascript project

See original GitHub issue

What problem does this feature solve?

I use vscode and volar, when I create a new vue project, I find a warning from <template> tag by valor:

TypeScript intellisense is disabled on template, you can config `"jsx": "preserve"` in tsconfig or jsconfig to enable it, or config `vueCompilerOptions.experimentalDisableTemplateSupport` to disable this prompt.

If you do nothing with it or just set vueCompilerOptions.experimentalDisableTemplateSupport in jsconfig.json, you will find that your intelligent completion won’t work anymore in template part. So I add "jsx": "preserve", and everything is fun again.

What does the proposed API look like?

Add "jsx": "preserve" to jsconfig.json by defualt when user create a vue3 javascript project.

Issue Analytics

State:
Created a year ago
Reactions:7
Comments:8

Top GitHub Comments

10reactions

Naveenkumar153commented, May 2, 2022

using this code add your jsconfig.json file. this code solve my problem

“vueCompilerOptions”: { “experimentalDisableTemplateSupport”: true, “jsx”: “preserve” }

0reactions

AaronBeaudoincommented, Sep 19, 2022

All I know is that it enables type checking in SFC templates. See https://github.com/johnsoncodehk/volar/issues/1153.

For more details ask the author johnsoncodehk.

Top Results From Across the Web

Use jsconfig.json to improve VS Code IntelliSense on a Vue.js ...

It can be done by adding a jsconfig.json file in your project. In this file you will specify a mapping table to link...

Enabling JSX Support in Vue after deliberately not supporting ...

We can solve this issue by adding the following code in our jsconfig.json : { "compilerOptions": { "jsx": "preserve" } }.

Setup | Vetur - GitHub Pages

# Project Setup · package.json must exist in the project root, Vetur uses it to determine the installed Vue version. · Next, create...

Vetur error with finding tsconfig.json or jsconfig.json-Vue.js

... "module": "esnext", // this enables stricter inference for data properties on `this` "strict": true, "jsx": "preserve", "moduleResolution": "node" } }.

Configuration Reference | Vue CLI

vue.config.js is an optional config file that will be automatically loaded ... if it's present in your project root (next to package.json )....