使用docker-compose部署Vue、react脚本

7 篇文章 0 订阅

受限于node环境的苦恼,写了一个通用的docker-compose脚本。

作用:可灵活切换node版本,一件部署。

操作流程:

  1. 在node项目(Vue、react)工作目录下创建DockerFile和docker-compose.yml文件
  2. 在DockerFile中输入对应内容(下面给出,可以固定化)
  3. 在docker-compose.yml中输入内容(下面给出,也强标注了对应命令)
  4. 运行docker-compose up -d

详细操作

  1. 在node项目(Vue、react)工作目录下创建DockerFile和docker-compose.yml文件
    1. 例如,Vue项目工作目录为:/home/use/workspace/shop,Vue的代码都在shop下,就在shop下创建DockerFile和docker-compose.yml文件
    2. 注意:工作目录路径中不能有其它特殊字符,-也不行,可以有_
  2. 在DockerFile中输入对应内容(下面给出,可以固定化)
    1.  在node后面指定对应node版本号
      1. # 需要安装的node的版本
        FROM node:14.19.1-alpine3.14
        # 将当前目录(dockerfile和docker-compose.yml所在的目录)映射到容器中/www/webl目录下
        ADD  ./ /www/web
        # 在容器中创建工作目录 /www/web
        WORKDIR /www/web

  3. 在docker-compose.yml中输入内容(下面给出,也强标注了对应命令)
    1. 在command指定要run start还是build
      version: '3.8'  # docker-compose的版本
      services:
        node:
          build:
            context: .  # 使用上下文为当前
            dockerfile: DockerFile 
          volumes:
            - ./:/www/web  # 把本地目录挂载到虚拟机的/www/web/下
          command: sh -c "cd /www/web && npm install && npm start"  # 开发调试用npm start,部署改为npm run build
          ports:
            - "13001:3000"  # 端口映射自定义,13001是宿主机端口,3000是Vue、react的端口
          stdin_open: true  # 启用输入

  4. 运行docker-compose up -d
    1. # 在工作目录下(DockerFile和docker-compose.yaml所在目录),执行
      # 后台启动
      docker-compose up -d
      # 查看日志
      docker-compose logs -f

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值