vite2 jsx/tsx 写vue提示:React is not defined

7,062 阅读1分钟

本文更新于2021-08-03 基于vite 2.4.4&vue 3.1.5,除了装个插件,不需要额外配置即可使用JSX/TSX!

// vite.config.js
...
import vueJsx from '@vitejs/plugin-vue-jsx' // 要安装@vitejs/plugin-vue-jsx
export default defineConfig({
  plugins: [...vueJsx({})], // 在这里加上
  ...
})

就可以了!!!!我还有另一篇文章是讲JSX/TSX写vue的,可以看看。有用的vue3 JSX&TSX使用说明。 (juejin.cn)

=================以下为老版本,千万别照着搞啊兄弟萌=============

原因是,vite2默认不完整支持jsx的写法。jsx and enableEsbuild have been removed; Use the new esbuild option instead 地址在这里

解决方案

//在vite.config.js添加esbuild选项
export default {
  esbuild: {
    jsxFactory: 'h',
    jsxFragment: 'Fragment'
  }
}

有用的话,点个赞呗?