npm install @vitejs/plugin-vue-jsx -D

import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' import vueJsx from '@vitejs/plugin-vue-jsx' // https://vitejs.dev/config/ export default defineConfig({ plugins: [vue(),vueJsx()], })

{ "compilerOptions": { "target": "esnext", "useDefineForClassFields": true, "module": "esnext", "moduleResolution": "node", "strict": true, "jsx": "preserve", "jsxFactory": "h", "jsxFragmentFactory": "Fragment", "sourceMap": true, "resolveJsonModule": true, "isolatedModules": true, "esModuleInterop": true, "lib": ["esnext", "dom"], "skipLibCheck": true, }, "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"], "references": [{ "path": "./tsconfig.node.json" }] }

 "jsx": "preserve", "jsxFactory": "h", "jsxFragmentFactory": "Fragment",

import { ref } from "vue"; let v = ref(""); let flag = ref(false); let arr = ref([0, 1, 2, 3, 4, 5]); // tsx不会自动结构所以该用.value还是要使用 type Props = { title: string; }; const renderDom = (props: Props, ctx: any) => { return ( 
点击emit
{props.title}
{v.value}
正确的
错误的
 {/* 
正确的
错误的
 */} {/* 不支持v-if 可用三元表达式去代替 */} 
{flag.value ? 
正确的
 : 
错误的
}
 {/* 不支持v-for 但可以用map循环去代替 */} {/*不支持v-bind，可以直接绑定数值 */} 
 {arr.value.map((item, i: any) => { return ( 
 {item} 
 ); })} 
 ); }; const clickIndex = (i: any) => { alert(i); }; const clickEmit=(ctx:any)=>{ ctx.emit('on-click',123) } export default renderDom;

{flag.value ? 
正确的
 : 
错误的
}

 {arr.value.map((item, i: any) => { return ( 
 {item} 
 ); })} 

type Props = { title: string; }; const renderDom = (props: Props, ctx: any) 

const renderDom = (props: Props, ctx: any)

点击emit

const clickEmit=(ctx:any)=>{ ctx.emit('on-click',123) }

const getNum = (num: number) => { console.log("我收到了", num); };