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

相关推荐
空中楼阁,梦幻泡影13 小时前
Docker安装MinIO
运维·docker·容器·minio·存储
今天不要写bug14 小时前
基于qrcode前端实现链接转二维码的生成与下载
前端·javascript·typescript·vue
Selegant15 小时前
Docker 搭建 MySQL 主从服务实战操作详解
mysql·docker·容器
剑小麟15 小时前
vue2项目中安装vant报错的解决办法
vue.js·java-ee·vue
嗑瓜子儿溜茶水儿18 小时前
docker 部署 kkfileview ; arm64; ky10;
java·docker
九思x18 小时前
通过docker-compose.yml文件一次性安装mysql、minio、redis服务
运维·docker·容器
编程小Y18 小时前
Docker常见问题
docker
scx_link19 小时前
使用docker安装ollama及ollama拉取模型的总结
运维·docker·容器·ollama
Warren9819 小时前
面试和投简历闲聊
网络·学习·docker·面试·职场和发展·eureka·ansible
传奇吉他手千早爱音19 小时前
怎么解决无法拉取Docker镜像?不如我们自己建一个加速站(
docker