vue + docker + docker-compose部署

服务器文件地址/data里面

1. 构建 Vue 项目

首先，确保你的 Vue 项目已经构建完成。如果你还没有构建过，可以通过以下步骤构建项目：

bash
复制编辑
# 安装依赖
npm install

# 构建 Vue 项目
npm run build

2. 把dist上传到服务器

3.外面新建一个docker-compose.yml文件

version: '3'
services:
  vue-app:
    image: nginx:alpine
    container_name: foodmenufront
    ports:
      - "8080:80"  # 将容器的 80 端口映射到本地的 8080 端口
    volumes:
      - ./foodmenufront:/usr/share/nginx/html  # 将本地的 dist 目录挂载到 Nginx 容器中的 HTML 目录
    restart: always

  vue-cms:
    image: nginx:alpine
    container_name: foodmenucms
    ports:
      - "8081:80"  # 将容器的 80 端口映射到本地的 8081 端口
    volumes:
      - ./foodmenucms:/usr/share/nginx/html  # 将本地的 other-dist 目录挂载到 Nginx 容器中的 HTML 目录
    restart: always