Vite React 应用程序：Docker 容器中的 esbuild 错误

Question

我正在努力掌握 vite 和 docker，所以如果我犯了愚蠢的错误，我深表歉意。

我运行遇到 docker 中的 esbuild 问题。我正在尝试进行开发设置，所以我想将我的代码安装到我的容器中，以便实时反映更改。

以前我使用 Dockerfiles 将 /frontend 和 /backend 复制到它们各自的容器中并且有效，我有我的 web 和 api 容器运行并愉快地互相交谈。但是，这意味着它没有获取任何代码更改，因此不适合开发。

所以我已经切换到卷安装，希望我可以让我的 docker 化的应用程序热重载，但是却遇到了这个错误。

这是我的 docker-compose.yml

version: "3.8"
services:
  api:
    image: node:16-slim
    volumes:
      - ./backend:/app
      - ./shared:/shared
    working_dir: /app
    command: yarn start:dev
    ports:
      - "3001:3001"
  web:
    image: node:16-slim
    volumes:
      - ./frontend:/app
      - ./shared:/shared
    working_dir: /app
    command: yarn dev
    ports:
      - "3000:3000"

这是我的 vite.config.js

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

// https://vitejs.dev/config/
export default defineConfig({
  server: {
    host: "0.0.0.0",
    port: 3000,
    fs: {
      strict: false,
    },
  },
  plugins: [react()],
});

这就是我要修复的错误：

web_1  | yarn run v1.22.15
web_1  | $ vite
web_1  | failed to load config from /app/vite.config.js
web_1  | error when starting dev server:
web_1  | Error: The package "esbuild-linux-64" could not be found, and is needed by esbuild.
web_1  |
web_1  | If you are installing esbuild with npm, make sure that you don't specify the
web_1  | "--no-optional" flag. The "optionalDependencies" package.json feature is used
web_1  | by esbuild to install the correct binary executable for your current platform.
web_1  |     at generateBinPath (/app/node_modules/esbuild/lib/main.js:1643:15)
web_1  |     at esbuildCommandAndArgs (/app/node_modules/esbuild/lib/main.js:1699:11)
web_1  |     at ensureServiceIsRunning (/app/node_modules/esbuild/lib/main.js:1856:25)
web_1  |     at Object.build (/app/node_modules/esbuild/lib/main.js:1749:26)
web_1  |     at bundleConfigFile (/app/node_modules/vite/dist/node/chunks/dep-713b45e1.js:68592:34)
web_1  |     at loadConfigFromFile (/app/node_modules/vite/dist/node/chunks/dep-713b45e1.js:68569:35)
web_1  |     at resolveConfig (/app/node_modules/vite/dist/node/chunks/dep-713b45e1.js:68119:34)
web_1  |     at createServer (/app/node_modules/vite/dist/node/chunks/dep-713b45e1.js:66633:26)
web_1  |     at CAC.<anonymous> (/app/node_modules/vite/dist/node/cli.js:687:30)
web_1  | error Command failed with exit code 1.
web_1  | info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
homepage_web_1 exited with code 1

我一天中的大部分时间都在阅读各种类似的 SO 问题和 github 线程，但我发现没有任何内容专门解决这个问题，至少以我理解的方式。如果有人能指出我哪里出错了，或者指出一个具有良好开发和生产设置的 docker 化 vite/react 应用程序示例，我将不胜感激。谢谢！

Answer 1

阅读并更好地理解了这个讨论后，终于设法让这个工作正常进行； https://github.com/vitejs/vite/issues/2671#issuecomment-829535806.

我在 MacOS 上，但容器是运行 Linux，当它尝试使用我安装的卷中的 esbuild 版本时，架构不匹配。因此，我需要在容器内重建 esbuild。我尝试按照该线程的建议使用入口点脚本，但这对我不起作用。

有效的是将我的 docker-compose.yml 中的命令更改为 command: sh -c "npm rebuild esbuild && yarn dev"。

热装如梦似幻

Vite React 应用程序：Docker 容器中的 esbuild 错误

Vite React app: esbuild error in Docker container

reactjs

docker

vite