vue3.X 结合vite 使用 JSX

技术点的官网(学习任何技术点第一步都需要翻翻官网)

1. vue3 https://cn.vuejs.org/
2. vite vitejs.dev/
3. element-plus element-plus.gitee.io/zh-CN/
4. JSX github.com/vitejs/vite…

使用方法

1. 在使用JSX之前需要引入 JSX 的包并引用

    
    pnpm i @vitejs/plugin-vue

  // 在vite.config 中导入并配置 @vitejs/plugin-vue

  import vue from '@vitejs/plugin-vue'

  export default {
   plugins: [vue()],
  }
 

注意： 再导入 JSX 之前 vite 的版本必须在4.0.0之后

2. 导入 plugin-vue-jsx

pnpm i @vitejs/plugin-vue-jsx
// 在vite.config 中导入并配置 @vitejs/plugin-vue-jsx
 
import vueJsx from '@vitejs/plugin-vue-jsx'
export default {
  plugins: [
    vueJsx({
      // options are passed on to @vue/babel-plugin-jsx
    }),
  ],
}

3. 使用