docker创建vue镜像

1.确保你已经安装了 Node.js 和 Vue CLI。

2.创建一个 Vue.js 项目(如果你还没有一个)

vue create my-vue-app

3.进入目录

cd my-vue-app

4.构建vue.js

npm run build

5.创建一个 Dockerfile 来构建 Vue 应用的 Docker 镜像:

基于 Node 官方镜像

FROM node:lts-alpine

设置工作目录

WORKDIR /app

复制 package.json 和 package-lock.json (如果有)

COPY package*.json ./

安装项目依赖

RUN npm install

复制项目文件和目录到工作目录

COPY . .

构建 Vue 应用

RUN npm run build

使用 Nginx 镜像作为基础来提供 web 服务器

FROM nginx:stable-alpine

从 Vue 应用镜像中复制构建好的文件到 Nginx 服务器的 html 目录中

COPY --from=0 /app/dist /usr/share/nginx/html

暴露 80 端口

EXPOSE 80

启动 Nginx,并且 Nginx 将持续运行

CMD ["nginx", "-g", "daemon off;"]

6.使用以下命令创建docker镜像

docker build -t my-vue-app .

7.运行vue.js应用的docker容器

docker run -d -p 8080:80 --name vue-app my-vue-app

相关推荐
SCBAiotAigc1 小时前
2026.5.1:`DockerDesktop must be owned by an elevated account`错误的解决办法
人工智能·docker·具身智能
jay神7 小时前
基于团队模式的C程序设计课程辅助教学管理系统
java·spring boot·vue·web开发·管理系统
钛态7 小时前
前端TypeScript高级技巧:让你的代码更安全
前端·vue·react·web
身如柳絮随风扬8 小时前
使用 Docker 部署禅道并实现自动化部署——从项目搭建到运维自动化的完整指南
运维·docker·自动化
eRTE XFUN9 小时前
docker下搭建redis集群
redis·docker·容器
一只小bit10 小时前
Docker 存储卷:本地文件与容器内部文件建立绑定关系
运维·docker·容器
都在酒里10 小时前
在公共服务器上构建 RK3588 SDK 的纯净 Docker 方案
运维·服务器·docker
jeCA EURG10 小时前
docker离线安装及部署各类中间件(x86系统架构)
docker·中间件·系统架构
身如柳絮随风扬10 小时前
使用 Docker 部署 Jenkins 并实现自动化部署 —— 从零到一的 CI/CD 实践指南
docker·自动化·jenkins
就叫飞六吧11 小时前
docker快速启动sqlserver实例并自动测试shell脚本
docker·容器·sqlserver