docker打包vue前端 conf端口映射多个

Docker 是一种流行的容器技术，可以用来部署不同的应用程序，包括前端应用程序。Vue 是一种流行的前端框架，用于构建现代化的 SPA 单页面应用程序。当我们使用 Docker 来部署 Vue 应用程序时，我们需要将 Vue 应用程序打包到 Docker 镜像中，并设置端口映射以便能够通过 Web 浏览器访问该应用程序。

Vue 应用程序通常使用 Node.js 作为运行时环境，因此我们可以使用 Node.js Docker 镜像来部署 Vue 应用程序。下面是一个示例 Dockerfile：

FROM node:14.16.0-alpine3.13
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
EXPOSE 8080 8081 8082
CMD ["npm", "run", "serve"]

在上面的 Dockerfile 中，我们首先从 Node.js 14.16.0-alpine3.13 镜像中构建一个容器。工作目录被设置为 /app。然后我们将 package.json 和 package-lock.json 文件复制到容器中，并运行 npm install 安装所有依赖。复制所有其他文件后，我们设置 EXPOSE 指令以将端口 8080、8081 和 8082 映射到宿主环境。最后，我们可以使用 CMD 指令启动和运行 Vue 应用程序。

在 Docker 容器中运行 Vue 应用程序后，我们可以使用 docker run 命令将容器映射到计算机上的端口。例如，如果我们在本地计算机上使用端口 8000 作为映射端口，我们可以运行以下命令：

docker run -p 8000:8080 -p 8001:8081 -p 8002:8082 vue-app

在上述命令中，-p 选项指定了端口映射。我们将容器中端口 8080、8081 和 8082 映射到宿主计算机上的端口 8000、8001 和 8002。vue-app 是我们构建的 Docker 镜像的名称。

总结来说，我们可以使用 Docker 容器来部署 Vue 应用程序，并使用端口映射将容器中的端口映射到宿主计算机上的端口。因此，我们可以在一个计算机上同时运行多个 Vue 应用程序。