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

相关推荐
说实话起个名字真难啊11 分钟前
用docker来安装openclaw
docker·ai·容器
恬静的小魔龙33 分钟前
【群晖Nas】群晖Nas中实现SVN Server功能、Docker/ContainerManager等
docker·svn·容器
Zfox_1 小时前
CANN Catlass 算子模板库深度解析:高性能 GEMM 融合计算、Cube Unit Tiling 机制与编程范式实践
docker·云原生·容器·eureka
春日见2 小时前
如何创建一个PR
运维·开发语言·windows·git·docker·容器
DARLING Zero two♡2 小时前
告别 Docker 命令行!Portainer+cpolar 让容器管理从局域网走向公网
运维·docker·容器
Cult Of3 小时前
Alicea Wind的个人网站开发日志(2)
开发语言·python·vue
liu****3 小时前
2.深入浅出理解虚拟化与容器化(含Docker实操全解析)
运维·c++·docker·容器·虚拟化技术
logocode_li4 小时前
OCI/CRI 双标准下:从 dockerd 到 containerd 的 K8s 运行时迭代史
docker·云原生·容器·k8s
_运维那些事儿15 小时前
VM环境的CI/CD
linux·运维·网络·阿里云·ci/cd·docker·云计算
lpruoyu18 小时前
【Docker进阶-05】Docker网络
网络·docker·容器