一下介绍基于node独立运行的vue前段项目Dockerfile 配置及启动

模式一、docker直接启动

项目根目录下创建Dockerfile文件。

#指定依赖镜像为node并制定版本,2020-1-7最新未定版本为12.13.1
FROM docker.io/node:12.13.1

# Create app directory
WORKDIR /usr/src/vueappdev

# Install app dependencies
# A wildcard is used to ensure both package.json AND package-lock.json are copied
# where available (npm@5+)
COPY package*.json ./
# 同步时区设置
RUN cp /usr/share/zoneinfo/Asia/Shanghai /etc/localtime && echo 'Asia/Shanghai' >/etc/timezone
#设置node源地址为淘宝源
RUN npm config set registry http://registry.npm.taobao.org/
#无需每次运行,灵活使用
RUN npm install

# If you are building your code for production
# RUN npm ci --only=production

# Bundle app source
COPY . .
#指定暴露端口号,此处应与项目配置中的端口号一直
EXPOSE 8080
#指定项目运行指令为 npm run prod
CMD [ "npm", "run", "prod" ]

运行命令:

#在项目根目录下执行一下命令
#生成docker镜像,镜像名为erms/web,注意命令结尾有个点
docker build -t erms/web .
#运行erms/web镜像,绑定容器的 8080 端口,将其映射到本地主机 127.0.0.1 的 9527 端口上,对外访问使用9527。
docker run -p 9527:8080 --name ermsweb -d erms/web


命令释义:
例如:docker run -itd -p 9527:8080 -v /user/local/ermsweb:/workspace --name ermsweb --restart=always erms/web

这里的/user/local/ermsweb是你的vue项目路径
-i: 以交互模式运行容器,通常与 -t 同时使用;
-t: 为容器重新分配一个伪输入终端,通常与 -i 同时使用;
-it的意思是,用一个终端跟容器进行交互;
-p: 端口映射,格式为:主机(宿主)端口:容器端口
-d: 后台运行容器,并返回容器ID;
--name="": 为容器指定一个名称;
--restart=always   表示在容器退出时总是重启容器;
具体解释详见菜鸟教程:
https://www.runoob.com/docker/docker-run-command.html

docker run -p 9527:8080 --name ermsweb -d erms/web命令将镜像运行起来之后,我们就可以通过宿主机的IP:9527来访问项目了。本地访问即可使用127.0.0.1:9527,云服务器可以用www.xxx.com:9527访问。

模式二、docker-compose

项目根目录下或任意位置创建docker-compose.yml

version: '3'

services:
  dev:
    image: erms/web
    ports:
      # 9527绑定宿主机端口,对外访问能使用。8080绑定docker容器端口,即项目端口
      - "9527:8080"
    #    restart: always
    volumes:
      - /user/local/erms:/workspace
    stdin_open: true
    tty: true

切换到docker-compose.yml所在目录(或者执行命令是指定compose文件位置),执行命令。

#生成镜像
docker build -t erms/web .
#docker compose命令启动
docker-compose up -d

访问方式与模式一相同。

模式三、docker集群docker swarm/stack模式运行

项目根目录下或任意位置创建docker-compose-ermsweb.yml

version: '3.3'

services:
  ermsweb:
    hostname: ermsweb
    image: erms/web
    ports:
      - target: 8080
        published: 9527
        mode: host
    labels:
      "type": "2"
    volumes:
      - /ceph/erms/ui/ERMS_UI:/usr/share/nginx/html
    networks:
      - edoc2_default
    deploy:
      # placement:
      #   constraints:
      #     - node.labels.nodetype == InDrive
      # 设置集群个数,这里以单机为例
      replicas: 1
      restart_policy:
        condition: on-failure
volumes:
  esdata:
    driver: local

networks:
  edoc2_default:
    external:
      name: indrive_edoc2
#生成镜像,镜像名称应与compose文件中的一致
docker build -t erms/web .
#创建docker集群服务,-c指定compose文件的位置,指定集群名称为erms
docker stack deploy -c /home/erms/compose/singelton/docker-compose-ermsweb.yml erms

访问方式相同。