我如何在 docker 中运行 vue3“npm run dev”？

Question

我想在 docker 容器中的节点图像上运行 vue。 但是当我执行“docker-compose up --build -d”时，我无法登录 docker 容器的日志并且终端和服务器未运行。

这是我的 DockerFile `

FROM node:lts

WORKDIR /var/www/html/app/

COPY package*.json ./

COPY . /app

RUN npm ci && npm cache clean --force

ENV NUXT_HOST=0.0.0.0
ENV NUXT_PORT=3000

EXPOSE 3000 
CMD ["npm" "run" "dev"]

`

这是我的 docker-compose.yml `

# docker-compose.yml
version: "3.9"

services:
  vue:
    container_name: vue
    image: node:lts
    working_dir: /var/www/html/app/
    entrypoint: /bin/bash
    build:
      context: .
      dockerfile: Dockerfile
    ports:
      - 3000:3000
    networks:
      my-network:
        aliases:
          - vue-app
    volumes:
      - ./:/var/www/html/app
    tty: true
    env_file:
      - ./.env

  nginx:
    image: nginx:1.15
    container_name: nginx
    volumes:
      - ./nginx/default.conf:/etc/nginx/conf.d/default.conf
    ports:
      - 80:80
      - 443:443
    networks:
      - my-network
    depends_on:
      - vue

networks:
  my-network:

`

这是我的模板 github 链接： https://github.com/cskhw/nuxt3-quasar-template如果你切换分支到“web”，你可以看到我的vue项目。

Answer 1

给您带来直接麻烦的最大的事情就是这个 Compose 覆盖：

# delete this line
entrypoint: /bin/bash

这会尝试运行交互式 shell 而不是您的开发服务器； 但是由于 Compose 运行后台服务，所以这个 shell 立即退出，你根本无法与之交互。

更一般地说，您有太多的 Compose 选项，其中有几个是危险的（值得注意的是，您正在用自定义图像替换node:lts ）。 我会将 Compose 文件缩减为

version: "3.8"
services:
  vue:
    build: .
    ports:
      - 3000:3000
    volumes: # (probably delete this too)
      - ./:/var/www/html/app
    env_file:
      - ./.env
  nginx:
    image: nginx:1.15
    volumes:
      - ./nginx/default.conf:/etc/nginx/conf.d/default.conf
    ports:
      - 80:80
      - 443:443

对于所有其他人，Compose 或您的 Dockerfile 提供了合理的默认值。 正如我在评论中暗示的那样，我通常还会删除volumes:块，这样您就可以使用图像中内置的代码，而不是用其他东西替换它； 这确实与您使用隔离容器模拟本地开发环境的愿望相冲突。

（相应地，我认为这里最简单的事情是直接在你的主机系统上运行npm npm run dev ，而不是 Docker；你在这里展示的东西似乎并没有因为被隔离在容器中而特别受益。）