当我不使用JSX时，为什么要警告JSX？

Question

我有一个vue.js组件文件（框架为quasar），其中＆lt; template＆gt; i具有以下代码块：

<q-btn
 color="green"
 label="save & continue editing"
 @click="saveCase()"
/>

它是其他代码的一部分。

该代码通过打字稿强调为错误：

错误的详细信息：

[{
    "resource": "/D:/dev-pro/secops-cases/front/src/components/Case.vue",
    "owner": "_generated_diagnostic_collection_name_#0",
    "code": "17004",
    "severity": 8,
    "message": "Cannot use JSX unless the '--jsx' flag is provided.",
    "source": "ts",
    "startLineNumber": 108,
    "startColumn": 11,
    "endLineNumber": 112,
    "endColumn": 13
}]

这是什么意思？我根本不使用React，只有VUE.JS，类星体和打字稿。 ＆lt; q-btn＆gt;是唯一突出显示为错误的元素，任何其他元素（通用或Quasar）都可以。

Answer 1

尝试添加关闭标签以避免此警告：

<q-btn
 color="green"
 label="save & continue editing"
 @click="saveCase()"
></q-btn>

也可以通过将“ JSX”：“ Preserve”，添加到compileroptions tsconfig中的条目来避免此问题。 .json文件：

{
  "extends": "./.nuxt/tsconfig.json",
  "compilerOptions": {
    "strict": true,
    "jsx": "preserve",
  }
}