Vue docker 容器

问题描述 投票:0回答:1

我有以下问题,

我有一个 Dokcerfile 来容器化 Vue 应用程序,当我尝试使用 `docker-compose` 时,该应用程序将无法启动,但是当我手动执行此操作时(使用 docker 命令,它可以工作),
有人可以告诉我问题是什么吗?

谢谢。

docker-compose.yml:

services:
  backend:
    build:
      context: .
      dockerfile: Dockerfile  # Dockerfile for FastAPI app
    networks:
      - restonet
    ports:
      - "443:443"  # Changed to use port 8443 for development
    volumes:
      - ./:/app  # Volume for hot-reload during development
    # environment:
    #   - PYTHONUNBUFFERED=1
    container_name: fastapi-backend
    image: fastapi-backend-img
    restart: "no"

  frontend:
    build:
      context: ./src
      dockerfile: Dockerfile  # Dockerfile for Vue.js app
    networks:
      - restonet
    ports:
      - "5174:5174"  # Changed to match the Vite development port
    volumes:
      - ./src:/app  # Volume for hot-reload during development
    depends_on:
      - backend
    container_name: vue-frontend
    image: vue-frontend-img
    restart: "no"

networks:
  restonet:
    driver: bridge  # Let Docker Compose create an internal network

Dockerfile:

FROM node:20

WORKDIR /app

COPY . .

RUN npm install

EXPOSE 5174

# Command to run the Vite development server
CMD npm run dev -- --port 5174 --host 0.0.0.0

输出:

2024-10-13 20:18:39 
2024-10-13 20:18:39 > [email protected] dev
2024-10-13 20:18:39 > vite --port 5174 --host 0.0.0.0
2024-10-13 20:18:39 
2024-10-13 20:18:39 /app/node_modules/rollup/dist/native.js:59
2024-10-13 20:18:39             throw new Error(
2024-10-13 20:18:39                   ^
2024-10-13 20:18:39 
2024-10-13 20:18:39 Error: Cannot find module @rollup/rollup-linux-x64-gnu. npm has a bug related to optional dependencies (https://github.com/npm/cli/issues/4828). Please try `npm i` again after removing both package-lock.json and node_modules directory.
2024-10-13 20:18:39     at requireWithFriendlyError (/app/node_modules/rollup/dist/native.js:59:9)
2024-10-13 20:18:39     at Object.<anonymous> (/app/node_modules/rollup/dist/native.js:68:76)
2024-10-13 20:18:39     ... 3 lines matching cause stack trace ...
2024-10-13 20:18:39     at Module._load (node:internal/modules/cjs/loader:1104:12)
2024-10-13 20:18:39     at cjsLoader (node:internal/modules/esm/translators:346:17)
2024-10-13 20:18:39     at ModuleWrap.<anonymous> (node:internal/modules/esm/translators:286:7)
2024-10-13 20:18:39     at ModuleJob.run (node:internal/modules/esm/module_job:234:25)
2024-10-13 20:18:39     at async ModuleLoader.import (node:internal/modules/esm/loader:473:24) {
2024-10-13 20:18:39   [cause]: Error: Cannot find module '@rollup/rollup-linux-x64-gnu'
2024-10-13 20:18:39   Require stack:
2024-10-13 20:18:39   - /app/node_modules/rollup/dist/native.js
2024-10-13 20:18:39       at Module._resolveFilename (node:internal/modules/cjs/loader:1225:15)
2024-10-13 20:18:39       at Module._load (node:internal/modules/cjs/loader:1051:27)
2024-10-13 20:18:39       at Module.require (node:internal/modules/cjs/loader:1311:19)
2024-10-13 20:18:39       at require (node:internal/modules/helpers:179:18)
2024-10-13 20:18:39       at requireWithFriendlyError (/app/node_modules/rollup/dist/native.js:41:10)
2024-10-13 20:18:39       at Object.<anonymous> (/app/node_modules/rollup/dist/native.js:68:76)
2024-10-13 20:18:39       at Module._compile (node:internal/modules/cjs/loader:1469:14)
2024-10-13 20:18:39       at Module._extensions..js (node:internal/modules/cjs/loader:1548:10)
2024-10-13 20:18:39       at Module.load (node:internal/modules/cjs/loader:1288:32)
2024-10-13 20:18:39       at Module._load (node:internal/modules/cjs/loader:1104:12) {
2024-10-13 20:18:39     code: 'MODULE_NOT_FOUND',
2024-10-13 20:18:39     requireStack: [ '/app/node_modules/rollup/dist/native.js' ]
2024-10-13 20:18:39   }
2024-10-13 20:18:39 }
2024-10-13 20:18:39 
2024-10-13 20:18:39 Node.js v20.18.0

但是,使用 docker 命令:

(.venv) PS D:\Dev\RestoR\saas-backend\src> docker build -t vue-frontend-img .
[+] Building 5.2s (10/10) FINISHED                                                                                                                                                                                  docker:desktop-linux 
 => [internal] load build definition from Dockerfile                                                                                                                                                                                0.0s 
 => => transferring dockerfile: 360B                                                                                                                                                                                                0.0s 
 => [internal] load metadata for docker.io/library/node:20                                                                                                                                                                          1.4s 
 => [auth] library/node:pull token for registry-1.docker.io                                                                                                                                                                         0.0s 
 => [internal] load .dockerignore                                                                                                                                                                                                   0.0s 
 => => transferring context: 75B                                                                                                                                                                                                    0.0s 
 => [1/4] FROM docker.io/library/node:20@sha256:fffa89e023a3351904c04284029105d9e2ac7020886d683775a298569591e5bb                                                                                                                    0.0s 
 => [internal] load build context                                                                                                                                                                                                   1.4s 
 => => transferring context: 39.36MB                                                                                                                                                                                                1.4s 
 => CACHED [2/4] WORKDIR /app                                                                                                                                                                                                       0.0s 
 => [3/4] COPY . .                                                                                                                                                                                                                  0.2s 
 => [4/4] RUN npm install                                                                                                                                                                                                           1.8s 
 => exporting to image                                                                                                                                                                                                              0.3s 
 => => exporting layers                                                                                                                                                                                                             0.2s 
 => => writing image sha256:912e0d118e0caf3b9448fa60c15373b271219286c4af40080c52b2a6bccfee88                                                                                                                                        0.0s 
 => => naming to docker.io/library/vue-frontend-img                                                                                                                                                                                 0.0s 

 1 warning found (use --debug to expand):
 - JSONArgsRecommended: JSON arguments recommended for CMD to prevent unintended behavior related to OS signals (line 16)

View build details: docker-desktop://dashboard/build/desktop-linux/desktop-linux/x0ufxchcnkox43jjyqdo3eyge
(.venv) PS D:\Dev\RestoR\saas-backend\src> docker run -it --volume "./src:/app" -p "5174:5174" --restart "no" --rm vue-frontend-img /bin/bash
root@9d8b8bd6bdf8:/app# npm run dev -- --port 5174 --host 0.0.0.0

> [email protected] dev
> vite --port 5174 --host 0.0.0.0


  VITE v5.4.8  ready in 282 ms       

  ➜  Local:   http://localhost:5174/ 
  ➜  Network: http://172.17.0.2:5174/
  ➜  press h + enter to show help    

为什么会发生这种情况,以及如何使 docker-compose 工作?

docker vue.js docker-compose docker-container
1个回答
0
投票

对 docker-compose 文件进行一点更改解决了这个问题:

services:
  backend:
    build:
      context: .
      dockerfile: Dockerfile  # Dockerfile for FastAPI app
    networks:
      - restonet
    ports:
      - "443:443"  # Changed to use port 8443 for development
    volumes:
      - ./:/app  # Volume for hot-reload during development
    # environment:
    #   - PYTHONUNBUFFERED=1
    container_name: fastapi-backend
    image: fastapi-backend-img
    restart: "no"

  frontend:
    build:
      context: ./src
      dockerfile: Dockerfile  # Dockerfile for Vue.js app
    networks:
      - restonet
    ports:
      - "5174:5174"  # Changed to match the Vite development port
    volumes:
      - ./src:/app  # Volume for hot-reload during development
+     - /app/node_modules  # Prevents overwriting node_modules with the host volume
    depends_on:
      - backend
    container_name: vue-frontend
    image: vue-frontend-img
    restart: "no"

networks:
  restonet:
    driver: bridge  # Let Docker Compose create an internal network
© www.soinside.com 2019 - 2024. All rights reserved.