vue3 JSX的使用与警告【JSX 元素隐式具有类型 “any“，因为不存在接口 “JSX.IntrinsicElements“】解决办法

一、安装

pnpm i @vitejs/plugin-vue-jsx -D

二、配置

1、tsconfig.json

"compilerOptions":{"jsx":"preserve"
}

2、vite.config.ts

import VueJsx from "@vitejs/plugin-vue-jsx"...plugin:[vue(),VueJsx()
]

三、简单使用案例

<script lang="tsx">
import { defineComponent } from 'vue'export default defineComponent({setup() {return () => (<div>FormTsx</div>)},
})
</script>

四、JSX 元素隐式具有类型 “any“，因为不存在接口 “JSX.IntrinsicElements“  的解决方法：

1、 不开启严格审查

{"compilerOptions": {"strict": false}
}

2、建议使用该方法

{"compilerOptions": {"noImplicitAny": false, // 是否在表达式和申明上有隐含的any类型时报错}
}