前端项目打包和自动化部署(jenkins+gitee+nginx)

项目打包和自动化部署

一. 项目部署和DevOps

1. 传统的开发模式

在传统的开发模式中，开发的整个过程是按部就班就行：

在这里插入图片描述

但是这种模式存在很大的弊端：

  • 工作的不协调：开发人员在开发阶段，测试和运维人员其实是处于等待的状态。等到测试阶段，开发人员等待测试反馈bug，也会处于等待状态。
  • 线上bug的隐患：项目准备交付时，突然出现了bug，所有人员需要加班、等待问题的处理；

2. DevOps开发模式

DevOps是Development和Operations两个词的结合，将开发和运维结合起来的模式：

在这里插入图片描述

在这里插入图片描述

3. 持续集成和持续交付

伴随着DevOps一起出现的两个词就是持续集成和持续交付(部署)：

  • CI是Continuous Integration（持续集成）；
  • CD是两种翻译：Continuous Delivery（持续交付）或Continuous Deployment（持续部署）；

持续集成CI：

在这里插入图片描述

持续交付和持续部署：

在这里插入图片描述

在这里插入图片描述

4. 自动化部署流程

在这里插入图片描述

二.搭建服务器环境

约定：本文使用的版本是OpenCloudOS 8.6（OpenCloudOS 8版本兼容 CentOS 8），java环境是openjdk 11.0.19
注意：

  • CentOS 7环境下node爆出如下错误

    node: /lib64/libm.so.6: version `GLIBC_2.27' not found (required by node)
node: /lib64/libc.so.6: version `GLIBC_2.25' not found (required by node)

    原因：CentOS低版本系统的 GLIBC 版本过低

    我们再查看 ldd 版本

    # ldd --version
ldd (GNU libc) 2.17
Copyright (C) 2012 Free Software Foundation, Inc.
This is free software; see the source for copying conditions.  There is NO
warranty; not even for MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
Written by Roland McGrath and Ulrich Drepper.

    我们发现系统中 GLIBC 版本仅为 17，而报错中显示我们缺失，25，27，28。而 GLIBC是向下兼容的，安装高版本的同时会安装低版本，所以我们只需要安装 GLIBC_2.28 即可。

    注意：如果有条件的话可以直接升级系统 CentOS 8，可以有效解决问题

  • jenkins将在2023年底不支持centos8以下版本。

1.jenkins自动化部署

安装java环境

注意jenkins版本对应支持的java版本

2.419 (August 2023) and newer

Java 11, Java 17, or Java 21

2.357 (June 2022) and newer

Java 11 or Java 17

2.164 (February 2019) and newer

Java 8 or Java 11

通过yum安装JDK

安装步骤

查看云端支持安装的jdk版本

yum search java | grep jdk

安装jdk（以下命令自动安装jdk相关依赖）

yum install -y java-11-openjdk

查看jdk版本，验证是否安装成功

java -version

安装git

使用 yum 安装 git，

yum -y install git

安装完成后，查看版本

git --version

安装jenkins

添加Jenkins镜像源

wget -O /etc/yum.repos.d/jenkins.repo https://pkg.jenkins.io/redhat-stable/jenkins.repo

如果出现报错：

ERROR: cannot verify pkg.jenkins.io’s certificate, issued by ‘/C=US/O=Let’s Encrypt/CN=R3’:
Issued certificate has expired.

解决：

sudo yum install -y ca-certificates

ca-certificates 起到了保障 SSL/TLS 连接安全的作用。在 Linux 系统中，安装 ca-certificates 软件包是非常重要的，因为它提供了一组可信任的根证书和中间证书，使得用户可以安全地与各种服务器通信。

导入公钥

rpm --import https://pkg.jenkins.io/redhat-stable/jenkins.io-2023.key

升级yum

yum upgrade

安装Jenkins 依赖包

yum install fontconfig java-17-openjdk

安装Jenkins

 yum install -y jenkins

启动Jenkins的服务：

systemctl start jenkins
systemctl status jenkins
systemctl enable jenkins

Jenkins默认使用8080端口提供服务，所以需要加入到安全组中：

在这里插入图片描述

Jenkins用户

我们后面会访问centos中的某些文件夹，默认Jenkins使用的用户是 jenkins，可能会没有访问权限，所以我们需要修改一下它的用户：

vim /usr/lib/systemd/system/jenkins.service

User=root
Group=root

修改jenkins_home 目录的用户和用户组

chown -R root:root /var/lib/jenkins

之后需要重启一下Jenkins：

systemctl restart jenkins

Jenkins配置

打开浏览器，输入：http://101.34.248.81:8080/

  • 注意：你输入自己的IP地址

问题

Jenkins卡首次界面Your browser will reload automatically when Jenkins is ready.

问题分析

可能原因是： 因为屏蔽导致的访问官网太慢。我们只需要换一个源，不使用官网的源即可。

问题解决

找到jenkins工作目录，打开文件hudson.model.UpdateCenter.xml

vim /var/lib/jenkins/hudson.model.UpdateCenter.xml

将 URL 改为https://mirrors.tuna.tsinghua.edu.cn/jenkins/updates/update-center.json

都需要重启Jenkins后解决

获取输入管理员密码：

  • 在下面的地址中 cat /var/lib/jenkins/secrets/initialAdminPassword

在这里插入图片描述

可以安装推荐的插件：

在这里插入图片描述

Jenkins任务

新建任务：

在这里插入图片描述

在这里插入图片描述

配置项目和保留策略：

在这里插入图片描述

源码管理：

在这里插入图片描述

构建触发器：

这里的触发器规则是这样的：

  • 定时字符串从左往右分别是：分 时 日 月 周
#每半小时构建一次OR每半小时检查一次远程代码分支，有更新则构建
H/30 * * * *#每两小时构建一次OR每两小时检查一次远程代码分支，有更新则构建
H H/2 * * *#每天凌晨两点定时构建
H 2 * * *#每月15号执行构建
H H 15 * *#工作日，上午9点整执行
H 9 * * 1-5#每周1,3,5，从8:30开始，截止19:30，每4小时30分构建一次
H/30 8-20/4 * * 1,3,5

在这里插入图片描述

构建环境：

注意：我们需要搭建Node的环境

  • 第一步：安装Node的插件；
  • 第二步：配置Node的环境；

在这里插入图片描述

第一步：插件管理中安装Node的插件

这里因为我已经安装过了，所以没有搜索到；

在这里插入图片描述
第二步：全局工具配置中配置Node的环境

在这里插入图片描述

在配置中选择刚刚安装的环境

在这里插入图片描述

构建执行的任务：

在这里插入图片描述

  • 查看Node的版本等是否有问题；
  • 执行 npm install 安装项目的依赖；
  • 移除原来/root/consult-patient-vue3/文件的所有内容；
  • 将打包的dist文件夹内容移动到/root/consult-patient-vue3/文件夹；
#!/bin/bash
pwd
node -v
npm -vnpm install 
npm run buildpwdecho '构建成功'ls# 删除/root/consult-patient-vue3/文件夹里所有的内容
rm -rf /root/consult-patient-vue3/* cp -rf ./dist/* /root/consult-patient-vue3/

2. nginx安装和配置

安装nginx

1、添加Nginx源

第一种方式: 需要先安装epel-release 因为Nginx并不在官方的yum源中,需要第三方的yum源

#我们在Centos下使用yum安装时往往找不到rpm的情况，官方的rpm repository提供的rpm包也不够丰富，
#很多时候需要自己编译很痛苦，而EPEL恰恰可以解决这两方面的问题
yum -y install epel-release#更新yum源
yum -y update

第二种方式: Nginx官网提供了Centos的源地址，可以如下执行命令添加源

rpm -Uvh http://nginx.org/packages/centos/7/noarch/RPMS/nginx-release-centos-7-0.el7.ngx.noarch.rpm

2、 安装Nginx

 yum install -y nginx

3、验证nginx安装是否成功

 #查看nginx安装版本，-V可以看到nginx的安装的文件路径nginx -V # 查看安装的nginx的版本rpm -qa | grep nginx

4、Nginx启动、设置开机自启、查看运行状态、停止命令

systemctl start nginx
systemctl enable nginx
systemctl status nginx
systemctl stop nginx

5、相关文件路径

①配置文件路径

#编辑Nginx配置文件
vim /etc/nginx/nginx.conf#检测配置文件语法是否正确
nginx -t#重新加载Nginx配置
nginx -s reload

Nginx默认配置文件(Nginx 1.20.1)

在这里插入图片描述

②日志路径

/var/log/nginx

配置nginx

我们这里主要配置nginx的用户和默认访问目录：

配置用户：

在这里插入图片描述

通过Linux命令创建文件夹和文件：

mkdir /root/consult-patient-vue3
cd /root/consult-patient-vue3
touch index.htmlvim index.html

配置访问目录：

在这里插入图片描述

此时访问

http://101.34.248.81/

在这里插入图片描述

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/192860.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

SmartSoftHelp8，文件/文件夹，Web服务器IIS文件安全设置工具

SmartSoftHelp8，文件/文件夹，Web服务器IIS文件安全设置工具

工作文件，文件夹 web服务器 iis 文件，文件夹安全设置 用户： administrator user guest everyone 权限： 完全控制（读、写） 只读 读取 写入 修改 读取和执行 下载地址： https://p…
阅读更多...
WPF绘图---Canvas中Polygon屏幕居中显示

WPF绘图---Canvas中Polygon屏幕居中显示

问题描述 在一个Canvas中绘制了多个Polygon&#xff0c;由于坐标可能超出界面显示范围&#xff0c;需要将绘制的Polygon居中显示&#xff0c;并且缩放至界面大小&#xff0c;效果如下&#xff1a; xaml代码 <Borderx:Name"border"Background"#fff"Cli…
阅读更多...
WebGL笔记：矩阵旋转运算的原理和实现

WebGL笔记：矩阵旋转运算的原理和实现

矩阵 矩阵&#xff08;Matrix&#xff09;是一个按照矩形纵横排列的复数集合 矩阵就像一个矩形的阵盘&#xff0c;通过其中纵横排列的元素我们可以摆出不同功能的阵法&#xff0c;比如位移矩阵、旋转矩阵、缩放矩阵 …在矩阵中的每一行&#xff0c;或者每一列数字构成的集合&a…
阅读更多...
每日一练2023.12.2——正整数A+B【PTA】

每日一练2023.12.2——正整数A+B【PTA】

题目链接&#xff1a;L1-025 正整数AB 题目要求&#xff1a; 题的目标很简单&#xff0c;就是求两个正整数A和B的和&#xff0c;其中A和B都在区间[1,1000]。稍微有点麻烦的是&#xff0c;输入并不保证是两个正整数。 输入格式&#xff1a; 输入在一行给出A和B&#xff0c;…
阅读更多...
Python面向对象①类与特殊方法【侯小啾python领航班系列（十九）】

Python面向对象①类与特殊方法【侯小啾python领航班系列（十九）】

Python面向对象①类与特殊方法【侯小啾python领航班系列（十九）】 大家好，我是博主侯小啾， 🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ🌹꧔ꦿ…
阅读更多...
Pikachu（三）

Pikachu（三）

RCE(remote command/code execute)概述 RCE漏洞&#xff0c;可以让攻击者直接向后台服务器远程注入操作系统命令或者代码&#xff0c;从而控制后台系统。 远程系统命令执行 一般出现这种漏洞&#xff0c;是因为应用系统从设计上需要给用户提供指定的远程命令操作的接口 比如我…
阅读更多...
flink源码分析之功能组件(四)-slot管理组件I

flink源码分析之功能组件(四)-slot管理组件I

简介 本系列是flink源码分析的第二个系列&#xff0c;上一个《flink源码分析之集群与资源》分析集群与资源&#xff0c;本系列分析功能组件&#xff0c;kubeclient&#xff0c;rpc&#xff0c;心跳&#xff0c;高可用&#xff0c;slotpool&#xff0c;rest&#xff0c;metrics&…
阅读更多...
docker+jmeter+influxdb+granfana

docker+jmeter+influxdb+granfana

centos7国内阿里源安装docker 1、安装必要的系统工具 sudo yum install -y yum-utils device-mapper-persistent-data lvm2 2添加官方仓库 sudo yum-config-manager --add-repo https://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.reposudo sed -i sdownload.doc…
阅读更多...
Knowledge Review（CVPR 2021）论文解析

Knowledge Review（CVPR 2021）论文解析

paper&#xff1a;Distilling Knowledge via Knowledge Review official implementation&#xff1a;https://github.com/dvlab-research/ReviewKD 前言 识蒸馏将知识从教师网络转移到学生网络&#xff0c;可以提高学生网络的性能&#xff0c;作为一种“模型压缩”的方法被…
阅读更多...
np.array无法直接用matplotlib画图，因为需要借用np.squeeze先转化

np.array无法直接用matplotlib画图，因为需要借用np.squeeze先转化

文章目录 前言一、使用步骤1.没使用np.squeeze转化2.使用np.squeeze转化 前言 实际工作中&#xff0c;时而难免会遇见np.array无法直接用matplotlib画图的情况&#xff0c;这个时候&#xff0c;是因为在画图之前少了一个步骤&#xff0c;需要先借用np.squeeze先转化 一、使用步…
阅读更多...
如何学习 Spring ？学习 Spring 前要学习什么？

如何学习 Spring ？学习 Spring 前要学习什么？

整理了一下Spring的核心概念BeanDefinitionBeanDefinition表示Bean定义&#xff0c;BeanDefinition中存在很多属性用来描述一个Bean的特点。比如&#xff1a;class&#xff0c;表示Bean类型scope&#xff0c;表示Bean作用域&#xff0c;单例或原型等lazyInit&#xff1a;表示Be…
阅读更多...
Matlab 在一个文件中调用另一个文件中的函数

Matlab 在一个文件中调用另一个文件中的函数

文章目录 Part.I IntroductionPart.II 方法Chap.I A 文件中只有一个函数Chap.II A 文件中有多个函数 Part.I Introduction 本文介绍一下在脚本文件 B 中调用文件 A 中的函数的方法。 Part.II 方法 目的&#xff1a;在文件B.m调用A.m中的函数 默认两个文件在一个文件夹下&…
阅读更多...
力扣611题 有效三角形的个数 双指针算法

力扣611题 有效三角形的个数 双指针算法

611. 有效三角形的个数 给定一个包含非负整数的数组 nums &#xff0c;返回其中可以组成三角形三条边的三元组个数。 示例 1: 输⼊: nums [2,2,3,4] 输出: 3 解释:有效的组合是: 2,3,4 (使⽤第⼀个 2) 2,3,4 (使⽤第⼆个 2) 2,2,3 ⽰例 2: 输⼊: nums [4,2,3,4] 输出: 4 解…
阅读更多...
我的wechat

我的wechat

阅读更多...
CAP概念和三种情况、Redis和分布式事务的权衡

CAP概念和三种情况、Redis和分布式事务的权衡

借鉴&#xff1a;https://cloud.tencent.com/developer/article/1840206 https://www.cnblogs.com/huanghuanghui/p/9592016.html 一&#xff1a;CAP概念和三种情况 1.概念&#xff1a; C全称Consistency&#xff08;一致性&#xff09;&#xff1a;这个表示所有节点返回的数…
阅读更多...
轻易云AI：引领企业数智化转型提升企业AI效率

轻易云AI：引领企业数智化转型提升企业AI效率

近期&#xff0c;轻易云AI与汤臣倍健的合作引起了业界的广泛关注。通过这一合作&#xff0c;轻易云AI不仅成功打造了集团小汤AI助手这一标志性的企业智能助手&#xff0c;更重要的是&#xff0c;这一合作凸显了轻易云AI作为专业AI应用集成专家的核心能力。轻易云AI已成功集成了…
阅读更多...
Spring之RestTemplate详解

Spring之RestTemplate详解

Spring之RestTemplate详解 1 RestTemplate1.1 引言1.2 环境配置1.2.1 非Spring环境下使用RestTemplate1.2.2 Spring环境下使用 RestTemplate1.2.3 Spring环境下增加线程号 1.3 API 实践1.3.1 GET请求1.3.1.1 不带参请求1.3.1.2 带参的get请求(使用占位符号传参)1.3.1.3 带参的g…
阅读更多...
Redis7--基础篇4（Redis事务）

Redis7--基础篇4（Redis事务）

Redis事务是什么 可以一次执行多个命令&#xff0c;本质是一组命令的集合&#xff0c;一个事务中的所有命令都会序列化&#xff0c;按顺序串行&#xff0c;而不会被其他命令插入。 其作用就是在一个队列中&#xff0c;一次性、顺序、排他的执行一系列命令。 Redis事务 VS 数据…
阅读更多...
【每日一题】拼车+【差分数组】

【每日一题】拼车+【差分数组】

文章目录 Tag题目来源解题思路方法一&#xff1a;差分 写在最后 Tag 【差分数组】【数组】【2023-12-02】 题目来源 1094. 拼车 解题思路 本题朴素的解题思路是统计题目中提到的每一个站点的车上人数&#xff0c;如果某个站点的车上人数大于车上的座位数直接返回 false&…
阅读更多...
基于 Vue、Datav、Echart 框架的 “ 数据大屏项目 “，通过 Vue 组件实现数据动态刷新渲染，内部图表可实现自由替换

基于 Vue、Datav、Echart 框架的 “ 数据大屏项目 “，通过 Vue 组件实现数据动态刷新渲染，内部图表可实现自由替换

最近在研究大数据分析&#xff0c;基于 Vue、Datav、Echart 框架的 " 数据大屏项目 "&#xff0c;通过 Vue 组件实现数据动态刷新渲染&#xff0c;内部图表可实现自由替换。部分图表使用 DataV 自带组件&#xff0c;可进行更改&#xff0c;详情请点击下方 DataV 文档…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023