如何在 Vite 的 Web Worker 中使用 JSX？答案

【问题标题】：How to use JSX in a web worker with Vite?如何在 Vite 的 Web Worker 中使用 JSX？
【发布时间】：2023-02-18 04:13:49
【问题描述】：

我正在使用 @remote-ui/react 库在 Web Worker 中呈现我的 React 代码。我在我的项目中使用 Vite，但每当我尝试在我的工作脚本中使用 JSX 时，我都会看到以下错误：

Uncaught Error: @vitejs/plugin-react can't detect preamble. Something is wrong. See https://github.com/vitejs/vite-plugin-react/pull/11#discussion_r430879201

我创建了一个最小复制品here。

【问题讨论】：

标签： reactjs vite

【解决方案1】：

禁用 React Fast Refresh 似乎可以解决问题：

// vite config
{
  plugins: [react({ fastRefresh: false })],
  worker: {
    plugins: [react()],
  },
}

【讨论】：

但这会减慢实时重新加载的速度，每次更改都会刷新页面，不知道为什么我突然遇到了这个错误

【解决方案2】：

如果碰巧有人遇到了同样的错误使用Laravel Vite, 人们可能会忘记按照 documentation 在 @vite 刀片指令之前添加 @viteReactRefresh。

【讨论】：