vite+vue3使用tsx

1. 安装项目

     npm init vite@latest
   

   根据提示选择 vue > vue-ts

2. 安装@vitejs/pugin-vue-jsx

     import VueJsx from '@vitejs/pugin-vue-jsx'
      export default defineConfig ({
         vue();
         vueJsx();
      })
   

3. 创建一个tsx文件

   import { Button } from 'ant-design-vue'
   export default {
      name: 'Button',
      props: {
        label: {
        	type: String,
        	default: '默认按钮'
        }
      },
      setup() {
        return ()=> {
           <Button>{props.label}</Button>
        }
      }
   }
   

4. 引入tsx文件使用

    <template><Button></Button><template>
    import Button from 'Button.tsx'
    export default {
    	components: {
    		Button
    	}
    }