我正在用vite编写一个标准的react应用程序。
package.json

{
  "name": "bpm",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview"
  },
  "dependencies": {
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-icons": "^4.4.0",
    "uuid": "^9.0.0"
  },
  "devDependencies": {
    "@types/react": "^18.0.17",
    "@types/react-dom": "^18.0.6",
    "@vitejs/plugin-react": "^2.1.0",
    "vite": "^3.1.0"
  }
}

vite.config.js

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

export default defineConfig({
  server: {host:'0.0.0.0', port:8080},
  plugins: [react()]
})

当我直接在wsl（ubuntu）中运行它时，使用yarn dev它运行得很好。我可以将浏览器指向http://localhost:8080，我的应用程序运行没有任何问题。
我也有这个基本的dockerfile，我用正常的方式构建：

from node:alpine3.15
workdir /app
copy package.json /app/package.json
run yarn
copy src /app/src
copy public /app/public
copy vite.config.js /app/
cmd ["yarn", "dev", "--debug"]

但是，当我在wsl中运行这个代码时：

docker run -it --rm -p 8080:8080 bpm

应用程序不再工作。
我所说的“不再工作”是什么意思呢？嗯，这就是有趣的地方。当应用程序启动调试输出时，显示vite已经解决了它的所有依赖项，所以vite看起来工作正常，它报告stdout没有错误，并报告了它的端口绑定。但是，当我访问应用程序根目录时：我得到了一个404.
如果输入URI，我可以访问应用程序中的文件：curl 'http：//localhost：8080/src/main.jsx'返回相应的源代码。因此，这不是Docker网络问题。
如果我导航到'http：//localhost：8080/index.html'，则该页面会加载，网络选项卡显示没有问题，但控制台会报告错误：

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

其中Toolbar.jsx是我的组件文件中的一个。
为了以防万一，我阅读了文档，并尝试添加：

origin: 'http://127.0.0.1:8080'

到vite服务器配置，它没有帮助（令人惊讶）。
关于这个主题似乎还有一些其他的问题（here和这里），但是这些问题和答案似乎没有涵盖我所看到的实际行为，尽管我已经阅读了它们并应用了它们的解决方案，但它们没有帮助。
我也尝试了不同的节点基容器和不同版本的节点，看起来没有什么区别。
我整晚都在想这件事，但现在有点烦人了。如果你有什么见解，我将不胜感激。