一、安装
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类型时报错
}
}