随着越来越多的项目使用 Vue3 ,前端项目可能面临新旧版本的问题,需要在本地切换
node.js
的版本,甚至出现一些依赖冲突的问题,为了避免这些问题最佳的方式是用 Docker 容器化来隔离每个开发环境。本文将介绍如何使用 Docker 对 Vue2 前端项目进行 Docker 化,用于项目开发过程。
进入本文的主题,在项目根目录下增加文件 Dockerfile
,代码如下:
FROM node:14.19-alpine3.15
WORKDIR /app
ENV PATH /app/node_modules/.bin:$PATH
# 安装并缓存应用程序依赖项
COPY package.json /app/package.json
RUN npm install
RUN npm install @vue/cli@3.7.0 -g
# start app
CMD ["npm", "run", "serve"]
再增加文件 .dockerignore
,内容如下:
node_modules
.git
.gitignore
这将加快 Docker 构建过程,因为本地依赖项和 git repo
不会被发送到 Docker 守护进程。
构建并标记 Docker 映像:
docker build -t vue2-app:dev .
在构建完成后运行容器:
docker run -it -v ${PWD}:/app -v /app/node_modules -p 8080:8080 --rm vu