reactjs - Impossible de déterminer automatiquement le point d'entrée à partir de rollupOptions ou des fichiers HTML et il n'y a pas de optimizeDeps explicites

Dans mon projet d'équipe, pour la partie frontend, nous utilisons vite, react, yarn, typescript.

Je vais construire et déployer Docker avec le frontend.

J'ai réussi à créer une image Docker avec le frontend, mais je ne peux pas la déployer.

Pour être plus précis, seul un déploiement partiel a réussi.

Lorsque je l'ouvre dans Docker et que je regarde les journaux du conteneur, je vois que cela ressemble à ce qui suit.

VITE v4.3.9  ready in 247 ms
➜  Local:   http://localhost:3000/
➜  Network: http://172.17.0.4:3000/
(!) Could not auto-determine entry point from rollupOptions or html files and there are no explicit optimizeDeps.include patterns. Skipping dependency pre-bundling.

http://172.17.0.4:3000 est l'IP du conteneur, pas celle de l'hôte. Troisièmement, le [IP de l'hôte]:3000 devrait ressembler à ceci

Dockerfile

FROM node:18

WORKDIR /app

COPY package* yarn.lock .pnp*     ./
COPY .yarnrc.yml                  ./
COPY .yarn                        ./.yarn

RUN yarn cache clean \
    && yarn install --frozen-lockfile

CMD ["yarn", "dev", "--host", "0.0.0.0", "--port", "3000"]

package.json

{
  "name": "react-vite-berry-boilarplate",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "start": "vite",
    "dev": "vite",
    "start:build": "serve -s build",
    "build": "tsc && vite build",
    "build:dev": "tsc && vite build --mode development",
    "build:prod": "tsc && vite build --mode production",
    "preview": "vite preview"
  },
  "dependencies": {
    "react": "^18.2.0",
    "react-dom": "^18.2.0"
  },
  "devDependencies": {
    "@types/node": "^20.2.5",
    "@types/react": "^18.2.8",
    "@types/react-dom": "^18.2.4",
    "@typescript-eslint/eslint-plugin": "^5.59.8",
    "@typescript-eslint/parser": "^5.59.8",
    "@vitejs/plugin-react": "^4.0.0",
    "eslint": "^8.42.0",
    "eslint-plugin-react-hooks": "^4.6.0",
    "eslint-plugin-react-refresh": "^0.4.1",
    "typescript": "^5.1.3",
    "vite": "^4.3.9",
    "vite-plugin-svgr": "^3.2.0",
    "vite-tsconfig-paths": "^4.2.0"
  },
  "packageManager": "[email "
}

vite.config.ts

import { resolve } from "path";
import { defineConfig } from "vite";
import tsconfigPaths from "vite-tsconfig-paths";
import react from "@vitejs/plugin-react";
import svgr from "vite-plugin-svgr";

export default defineConfig({
  entry: "./build/index.html",
  plugins: [react(), tsconfigPaths(), svgr()],
  server: {
    port: 3000,
    host: true,
    open: "/",
  },
  build: {
    rollupOptions: {
      input: {
        main: resolve(__dirname, "index.html"),
      },
    },
    commonjsOptions: {
      include: [".yarn/**"],
    },
  },
  cacheDir: "./.vite",
  define: {
    global: "globalThis",
  },
});

tsconfig.json

{
  "compilerOptions": {
    "baseUrl": "src",
    "target": "ES2020",
    "useDefineForClassFields": true,
    "lib": ["ES2020", "DOM", "DOM.Iterable"],
    "module": "ESNext",
    "skipLibCheck": true,

    /* Bundler mode */
    "moduleResolution": "bundler",
    "allowImportingTsExtensions": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx",

    /* Linting */
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noFallthroughCasesInSwitch": true,
    "paths": {
      "@components/*": ["components/*"],
      "@pages/*": ["pages/*"],
      "@hooks/*": ["hooks/*"],
      "@utils/*": ["utils/*"],
      "@assets/*": ["assets/*"]
    }
  },
  "include": ["src"],
  "references": [{ "path": "./tsconfig.node.json" }]
}

J'ai vraiment beaucoup cherché et demandé à d'autres personnes, mais il n'y avait aucune information sur vite, donc je l'ai laissé ici.

J'espère que quelqu'un connaît la réponse à ce problème

merci