我无法访问我的容器,但在它创建后,我有这样的消息:

enter image description here

I propose that this problem occures by bad ports configuration.

#Dockerfile

FROM node:20.11.1-alpine as builder
WORKDIR /app
COPY package.json ./
COPY package-lock.json ./
RUN npm install
COPY . .
EXPOSE 5173
CMD [ "npm", "run", "dev" ]

#docker-compose.dev.yml

version: "3.8"

services:
  app:
    container_name: front-end-app
    image: app-dev
    build:
      context: ./../
      dockerfile: ./Dockerfile
    volumes:
      - ./src:/app/src
    ports:
      - 5173:5173
    stdin_open: true
    env_file:
      - ./../.env

#Package.json

  "scripts": {
    "dev": "vite",
}

!已更新 #vite.config.ts

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

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [tsconfigPaths(), react()],
});

推荐答案

我发现您没有正确的维生素E配置.您应该向其中添加几行代码,以使VTE可以在docker中工作

    import { defineConfig } from "vite";
    import react from "@vitejs/plugin-react";
    import tsconfigPaths from "vite-tsconfig-paths";
    
    export default defineConfig({
      plugins: [tsconfigPaths(), react()],
      server: {
        watch: {
          usePolling: true,
        },
        host: true,
        strictPort: true,
        port: 5173,
      }
    });

您可以选中此处的选项:https://vitejs.dev/config/server-options

Reactjs相关问答推荐

LocalStore未存储正确的数据

有没有方法覆盖NextJS 14中的布局?

有没有办法将在服务器端全局获取的一些数据传递到Next&>13应用程序目录中的客户端组件?

导致useState中断的中断模式

Redux Store未触发React组件中的重新呈现

无法在主组件的返回语句中呈现预期组件

React Context未正确更新

GitHub页面未正确显示Reaction应用程序网站

使用Next.js和Next-intl重写区域设置

悬停轴时重新绘制自定义参照线

当从子状态更改复制时,react 父状态更改.我该如何防止这种情况?

ReactJS 动态禁用按钮

如果传递给挂钩的数据需要事先修改,如何使用自定义挂钩?

map 未显示在react 传单中

如何在 v6.4 中将 Auth0 提供程序与新的 createBrowsereRouter 一起使用?

react 路由路由加载器不适用于嵌套组件

交换键仍然引入了 fresh 的 DOM 元素

axios post方法中的请求失败,状态码为500错误

服务器端分页未按预期工作

react 路由:router.ts:11 没有匹配的路由位置/管理