结合docker发布前端项目(基于npm包管理)的shell脚本


本教程依据个人理解并经过实际验证为正确,特此记录下来,权当笔记。

注:基于linux操作系统

目前主流的前后端分离的项目中,常常在部署上线这个环节会遇到很多麻烦,这里我使用了docker进行部署,这段shell脚本我放在前端工程目录下,每次要部署上线时运行这个文件,可以很方便的帮助上线。注解都写在了代码中。
#!/usr/bin/env bash

// 以下用变量存放一些配置信息
BUILD_PROFILE="prod"
PORT="7002"
LOGIN_COMMAND="login --username=... -p=... registry.cn-hangzhou.aliyuncs.com"
DOCKER_NAME="your_docker_name"
repo="registry.cn-hangzhou.aliyuncs.com/your_project/${DOCKER_NAME}:latest"
REMOTE_SERVER="root@100.100.100.100"
JOB_NAME=${DOCKER_NAME} #编译
echo start to compile // 提示开始执行此段脚本
rm -rf dist // 项目基于npm管理,打包后所有的资源都存放在dist文件中,这里清除上一次生成的文件
npm run build-${BUILD_PROFILE} // 打包生产环境的代码 # Docker
echo Start to build docker... // 开始构建docker镜像 cd ci // 脚本放在ci目录下,进入该目录
rm -rf dist // 删除上一次生成的文件
cp -rf ../dist . // 将新生成的dist文件拷贝到ci目录下
docker build -t ${DOCKER_NAME} . // 开始构建镜像,Dockerfile文件在我另一篇博客中会有介绍
rm -rf dist // 构建完成后删除dist文件 docker ${LOGIN_COMMAND} // 登录远程docker仓库
docker tag ${DOCKER_NAME} ${repo} // 打标签
docker push ${repo} // push到远程仓库 # Deploy
echo deploy to remote server... // 开始发布 ssh ${REMOTE_SERVER} " docker ${LOGIN_COMMAND}; docker pull ${repo}; docker rm -f $JOB_NAME || true; // docker run -d -p ${PORT}:80 --name ${JOB_NAME} ${repo};"
// 使用ssh登录远程服务器,并执行后面的命令,拉取镜像,并构建容器。

结合docker发布前端项目(基于npm包管理)的shell脚本的更多相关文章

  1. 结合docker发布后端项目(基于gradle包管理)的shell脚本

    结合docker发布后端项目(基于gradle包管理)的shell脚本 本教程依据个人理解并经过实际验证为正确,特此记录下来,权当笔记. 注:基于linux操作系统(敏感信息都进行了处理) 目前主流的 ...

  2. AntDeploy发布前端项目到IIS(脱离vs单独使用)

    AntDeploy AntDeploy是一款开源的一键发布部署工具,目的是代替重复性的发布动作,提高部署效率 1.一键部署iis 2.一键部署windows服务 3.一键部署到Docker 4.支持增 ...

  3. git npm包管理

    #Node # node 一.安装nodejs 下载地址:http://nodejs.cn/download/ 二.安装git 下载地址:https://git-scm.com/download/wi ...

  4. 【转】npm包管理器那些事

    原文链接:http://www.cnblogs.com/shuoer/p/7782125.html npm包管理器那些事! 今天和朋友针对npm包全局安装和本地项目安装这个梗展开的激烈的讨论,故此做一 ...

  5. nodeJS---模块与npm包管理工具

    nodeJS---模块与npm包管理工具 一:从模块外部访问另一个模块内的成员; 假如我现在还在D盘中的node文件夹内中的app.js代码改成如下: var msg = 'hello'; var f ...

  6. NPM 包管理工具详解,使用教程

    NPM 包管理工具 1.1 定义:什么是 NPM NPM 全称 Node Package Manager,它是 JavaScript 的包管理工具, 并且是 Node.js 平台的默认包管理工具.通过 ...

  7. node.js零基础详细教程(3):npm包管理、git github的使用

    第三章  建议学习时间4小时  课程共10章 学习方式:详细阅读,并手动实现相关代码 学习目标:此教程将教会大家 安装Node.搭建服务器.express.mysql.mongodb.编写后台业务逻辑 ...

  8. node.js中npm包管理工具

    现在安装node.js,默认就会帮我们装上了npm包管理工具,npm主要用来下载,安装,管理第三方模块. 创建一个包描述文件: npm init [-y] 查看包的信息 npm info <pa ...

  9. npm包管理器报错-npm ERR! Response timeout while trying to fetch https://registry.npmjs.org/@XXX(over 30000ms)

    由于这两天买的新电脑在短期内频频蓝屏.卡机,不得不把自己其他的本本拿出来换上,但是程序员换电脑是真的痛苦,其他不说就说一个配环境 真的折腾哈 我是一名前端菜鸟,现在自己的本本上使用的是npm包管理工具 ...

随机推荐

  1. HDU1711 Number Sequence 题解 KMP算法

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1711 题目大意:最基础的字符串匹配,只不过这里用整数数组代替了字符串. 给你两个数组 \(a[1..N ...

  2. CentOS7.0下安装FTP服务的方法

    http://www.jb51.net/article/106604.htm   本篇文章主要介绍了CentOS7.0下安装FTP服务的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟 ...

  3. httpClient Post例子,Http 四种请求访问代码 HttpGet HttpPost HttpPut HttpDelete

    httpclient post方法 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 //----1. HttpPost request = new HttpPost(ur ...

  4. 【React】富文本编辑器 清空文本内容 获取HTML

    富文本编辑器  React  传入 import React,{Component } from 'react'; import { Card, Button, Table, Form, Select ...

  5. H3C 路由表的构成

  6. H3C DHCP中继基本配置

  7. 【50.40%】【BZOJ 4553】[Tjoi2016&Heoi2016]序列

    Time Limit: 20 Sec  Memory Limit: 128 MB Submit: 371  Solved: 187 [Submit][Status][Discuss] Descript ...

  8. dotnet 控制台 Hangfire 后台定时任务

    本文告诉大家如何在 dotnet core 的控制台通过 Hangfire 开启后台定时任务 首先需要安装 HangFire 这个 Nuget 库,通过这个库可以用来做定时任务,虽然很多时候都是在 A ...

  9. poj2826 An Easy Problem?!(计算几何)

    传送门 •题意 两根木块组成一个槽,给定两个木块的两个端点 雨水竖直下落,问槽里能装多少雨水, •思路 找不能收集到雨水的情况 我们令线段较高的点为s点,较低的点为e点 ①两条木块没有交点 ②平行或重 ...

  10. vue中的computed和watch区别

    在vue.js官方文档中看到computed和watch获取全名的一个例子: var var vm = new Vue({ el: '#demo', data: { firstName: 'Foo', ...