前端自动化
介绍
![在这里插入图片描述](https://img-blog.csdnimg.cn/1d050ba4feb34861b54ad27498a62ed6.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/292e555fa2624e2287c48475dc7802b9.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/c7188de062e7469d86997d4d7fe87e03.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
git push origin master -f
强制覆盖先前提交
CI/CD工具介绍
![](https://img-blog.csdnimg.cn/baaa1caa25cf4df4989c3d7d0c05b9ce.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
Jenkins搭建
搭建要点
![在这里插入图片描述](https://img-blog.csdnimg.cn/9ff93db52cbc48dc8dca88ac40efa120.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
dockerhub
https://hub.docker.com/ ![在这里插入图片描述](https://img-blog.csdnimg.cn/fdeee7b671914acb81761b06c3edadca.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/cc65949093af4f57be9a8d6a9fd6bd06.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/ae8d8f742a094cad9d64d7cf31dfa6ab.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
课程架构
![在这里插入图片描述](https://img-blog.csdnimg.cn/d68d777d5609409da583964d550c7ef7.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/f248fca3736845e7a1004de8fbd8c392.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
docker run --name jenkins_zero -itd -p 11005:8080 -p 50000:50000 jenkins/jenkins:lts
![在这里插入图片描述](https://img-blog.csdnimg.cn/8bfdaf4b36634dbc8bdcf69eb5b97c94.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
docker logs -f jenkins_zero
![在这里插入图片描述](https://img-blog.csdnimg.cn/0879e0af6ccd41ceb9ecf556e27b7a95.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
firewall-cmd --add-port=11005/tcp --permanent
永久放行端口号
firewall-cmd --reload
重新加载防火墙规则
本地打开jenkins
![在这里插入图片描述](https://img-blog.csdnimg.cn/a3698d8c6a7448ba980436f575cbd543.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/cf7e516c2c164377993656809bc62f17.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) 出现错误重新来几次即可 ![在这里插入图片描述](https://img-blog.csdnimg.cn/5c47f154730944a9bdb551af59c21f13.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/175eed0e9c3b4373b01523ca342f649b.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) jekins全局地址 后面与gihub连接 ![在这里插入图片描述](https://img-blog.csdnimg.cn/df84a4d475974b7b93ba21ea70a7738b.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/e128a37e4eba4188b354784ccada4787.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
离线安装插件方法(没有选择默认插件)
![在这里插入图片描述](https://img-blog.csdnimg.cn/3b5d4232023b4316b5cb2e2b0ad3dc75.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/582c8c9dc73145aa9e6a0696dcc107aa.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/d837e78f2096484988667fb9cbd4fd5f.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/2bef0ba4ee4a42738d27169f72c90154.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/a1e232a8c38d4badb4df8c87fac5da06.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/16cb88a460e641e7b456513c3769afa1.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/2878f4f835fe48619c7198797b955fc1.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/ecafbb9ee08e4d65af4ea06f95aa34aa.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/b65c368cc76d445a86b5b398371abf18.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
局域网安装插件
![在这里插入图片描述](https://img-blog.csdnimg.cn/21f4a95789384d739409caf319c27c9b.png) ![在这里插入图片描述](https://img-blog.csdnimg.cn/198dad8ca07d457aa1510c99f3e6b90b.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/f65d6af62ca54a5b8248586a072a46b2.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/037c89238e4b45cbaa1e75da96aec22e.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/01edf80a3be2443395c85eedfdf47c81.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/f23322fba9774fa491d6a545d77ba611.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/6d7e924569534e9f8934239337e2b477.png)
![在这里插入图片描述](https://img-blog.csdnimg.cn/6b4e99172afd441fa189b7252abb3871.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/2f1c1071704f40f59d3996d5ce5afb7c.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/56d26c406ec040dda95035b94a3be860.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/5fba3f2ec8084e3b93a6118d1b8bbc95.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/baf906181bcc4a5688bc8a3a9dcdeb86.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
安装常用插件
![在这里插入图片描述](https://img-blog.csdnimg.cn/20ab000319bb4db6a5d5fac5c01019af.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/13f86ab5cb2e42d38f239390520a678b.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
![在这里插入图片描述](https://img-blog.csdnimg.cn/e122305983854d4e8c673814180c2fc6.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
备份镜像
![在这里插入图片描述](https://img-blog.csdnimg.cn/62ff911ae3ea46d7ad363574b3e7a5c8.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/95a6e062d52446c3b66c8cd0d7c008eb.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/71af887b929c431d8f7e2dab9a423e3e.png)
tmp目录linux重启后数据会重置
![在这里插入图片描述](https://img-blog.csdnimg.cn/aa56a7b8fb2c4d2588d3b509c7361d92.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/a012eb31b82a405aa76fa2acb9fecf60.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
备份容器方式2
![在这里插入图片描述](https://img-blog.csdnimg.cn/c478d88a232a4591bd949fdd0b8aebe6.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/33570248fab840eb92e15ac34a17c261.png)
备份完成
![在这里插入图片描述](https://img-blog.csdnimg.cn/ca2a863b0b354bb5904a01c06827205a.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
解压
![在这里插入图片描述](https://img-blog.csdnimg.cn/90b75371e69646c48eb8a403c708f43d.png) ![在这里插入图片描述](https://img-blog.csdnimg.cn/dcc111faf9d648b7ad4b884d51901c24.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
备份容器方式3(最终方案)
![在这里插入图片描述](https://img-blog.csdnimg.cn/ade982aa6e8b4ec6b5b24509c66ed620.png) ![在这里插入图片描述](https://img-blog.csdnimg.cn/1dc6f74a2fde4e4abac7b47c53e596a7.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
搭建小结
![在这里插入图片描述](https://img-blog.csdnimg.cn/6bd8a9398e2e4dba8624e7fb655e43c2.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
Jenkins权限管理
全局安全配置
![在这里插入图片描述](https://img-blog.csdnimg.cn/b0dca97e86d14eaa9930857a845dd13e.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/876b8aaf4f9c4cd295f282562d54da8a.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/d29ac423fb764978987ed545728bcfe4.png) ![在这里插入图片描述](https://img-blog.csdnimg.cn/e776674f22e3417e86bc267cc88c0060.png) ![在这里插入图片描述](https://img-blog.csdnimg.cn/2979b4344a9b4617aa678f61be386b12.png) ![在这里插入图片描述](https://img-blog.csdnimg.cn/5e08d7d76e494959a59df03903e13c8e.png) ![在这里插入图片描述](https://img-blog.csdnimg.cn/790234bf0cb84aa59a7866b5251ec79b.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
![在这里插入图片描述](https://img-blog.csdnimg.cn/e1ae1df4c133497a91349285da244cde.png) ![在这里插入图片描述](https://img-blog.csdnimg.cn/f38e0f50b1964a8a975a604749ef4bfd.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/7d8585464755430db11e95fd338ac940.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/66c96cd1083f45f5a33ac024ab4ce7bd.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/6b9f50b06b1e4ebaae0a36d3b2a13644.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/218cfc9a32784f079a4a11fc962d8e39.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
Role-Based Strategy
![在这里插入图片描述](https://img-blog.csdnimg.cn/a97e68ef38ef4a50b5b3c599ca488878.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/7c4852ebe1ab4eefab034cc6543dabfd.png) ![在这里插入图片描述](https://img-blog.csdnimg.cn/880d541650f24f6a98a156d7d20c6093.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/ca36aaafb48c48848c26713e8fc37769.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/1b639e755d424acb8d23b87de9532812.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
安全矩阵
![在这里插入图片描述](https://img-blog.csdnimg.cn/257da21ebd9e455eae7508762715b56d.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/e0570e4a0c7f459196597d16adc85f62.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/b35bc7745f49440294dd2b0a58e34c0f.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) 一定要添加否则很麻烦 ![在这里插入图片描述](https://img-blog.csdnimg.cn/e93ae673ae314805879af4cf919bbe07.png)
![在这里插入图片描述](https://img-blog.csdnimg.cn/0cb932ff36724a2683318b85877bad05.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/6c4c625d20664c2fba5feec0ac67f241.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
gilab(gitlab登录jenkins,用户记得密码更少)
![在这里插入图片描述](https://img-blog.csdnimg.cn/dd81107d3d15490a9014d50f00066613.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/04365c91465640068d12ecc55b75ad66.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/0b88ade6d3bd46b0b70d4ee64a364bde.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/66c102c956674e7997465c6d1a2aba4f.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
![在这里插入图片描述](https://img-blog.csdnimg.cn/da32528e976d4964832b0f5737405bf8.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/e1fac9c15e0544999376537b5f09aa64.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/e2555c85278544e6b6c3c1945a3a8584.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/0b46f0707f8740feb0fd8580531bfcad.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/4a28576832a249fcb0e99cf111ce87b3.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/4679a759fb7042cdb035aa53edee55d2.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
![在这里插入图片描述](https://img-blog.csdnimg.cn/3158c84bc8b440eb891489c9c0812367.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
部分用户无法登陆 ![在这里插入图片描述](https://img-blog.csdnimg.cn/f17cb6349c564bdeb07f8ec5dd8dfa03.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/fc73505cc4a2460d840cfbd7ff3c74d9.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) 退出jenkins登录 ![在这里插入图片描述](https://img-blog.csdnimg.cn/a721f23b0418487b86003394e79750e9.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/bf019a72d1e0425581469c225e3266f0.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/8c81df1dcdd544e98cef946d36ad27e1.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
权限管理总结
Role-based Aurthorization Strategy
![在这里插入图片描述](https://img-blog.csdnimg.cn/f3ede70528cd4732ac1bef812416e252.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/f724d62540804171b6abf9be305e03ef.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
![在这里插入图片描述](https://img-blog.csdnimg.cn/9a25fa5e7923414a847a657c776c9a7d.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
Jenkins与gitlab对接
创建gitlab项目(私有)
![在这里插入图片描述](https://img-blog.csdnimg.cn/a71f90327df84dcaa55f60291ce16bd2.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
配置jenkins凭据
![在这里插入图片描述](https://img-blog.csdnimg.cn/cfb39b1867a24c01b62fd65be1db9bff.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/67772adffc594b1bb159af4ac7e5f504.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
jenkins设置私钥
![在这里插入图片描述](https://img-blog.csdnimg.cn/080da7a8e167485c8f766da1b6ea6811.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/f7f01d1edd8440a5ba54215ef52fe76d.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
gilab设置公钥
![在这里插入图片描述](https://img-blog.csdnimg.cn/810a51bcb97647afb56d0d1eb38cde71.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
配置
![在这里插入图片描述](https://img-blog.csdnimg.cn/deba6a05a8e54829be06b254d4d5509e.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/51a76f06f2e24247a50907cd06843c86.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/e7beff29415a403eb9c8148b642f461c.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
![在这里插入图片描述](https://img-blog.csdnimg.cn/0a677d3681314b9fa21af5ad38f88c4f.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/03d9b0550a804a12a1f1307052eff4e6.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
集成gitlab
![在这里插入图片描述](https://img-blog.csdnimg.cn/6b93b0196fa44f238ca0eea76a65e2a3.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
![在这里插入图片描述](https://img-blog.csdnimg.cn/20f2f9cf685d4759bc0cedfaa6435f89.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/ad6ec528d1004ddca36e3daa433d9c43.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/eb37b099923f48a286d601e96b421fa5.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/2e923a37641a47caa4727302d8b99169.png)
jenkins
![在这里插入图片描述](https://img-blog.csdnimg.cn/322e6461ef7a4c4face575e58fd9e527.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
![在这里插入图片描述](https://img-blog.csdnimg.cn/9334a602bbaa4a2a9f5de80e0faf6c9a.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
模拟
![在这里插入图片描述](https://img-blog.csdnimg.cn/907fece43aba4fdaa36f972b54b1a6fe.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
![在这里插入图片描述](https://img-blog.csdnimg.cn/ce9346bf3037452d95fd63304ceac31a.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
总结
![在这里插入图片描述](https://img-blog.csdnimg.cn/413bfeec1a804dc8aa33883bb3237c98.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
DockerFile
方式一
![在这里插入图片描述](https://img-blog.csdnimg.cn/c5739b84cd9f4bc7b8cd0ae4a3551abd.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
前端项目配置Dockerfile
# build stage
FROM node:14 as build-stage
LABEL maintainer=rollsroycewkk@qq.com
# 创建一个工作目录
WORKDIR /app
COPY . .
RUN yarn install --registry=https://registry.npm.taobao.org
RUN npm run build
# production stage
FROM nginx:stable-alpine as production-stage
COPY --from=build-stage /app/dist /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]
![在这里插入图片描述](https://img-blog.csdnimg.cn/2b97cbdc9edb4fa4adeb51ff256c25d6.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/ca9fcf8d2f9e42b39c00d2ad8efe0c7a.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
前端项目配置.dockerignore
# Dependency directory
# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git
node_modules
.DS_Store
dist
# node-waf configuration
.lock-wscript
# Compiled binary addons (http://nodejs.org/api/addons.html)
build/Release
.dockerignore
Dockerfile
*docker-compose*
# Logs
logs
*.log
# Runtime data
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw*
pids
*.pid
*.seed
.git
.hg
.svn
后端项目配置Dockerfile
FROM node:14
LABEL maintainer=rollsroycewkk@qq.com
# 创建一个工作目录
WORKDIR /app
COPY . .
RUN yarn install --registry=https://registry.npm.taobao.org
# 这里产生了dist目录,及server.bundle.js
RUN npm run build
EXPOSE 12005
# 上传配置一些静态图片资源
VOLUME ["/app/public"]
# 运行node
CMD ["node","dist/server.bundle.js"]
后端项目配置.dockerignore
# Dependency directory
# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git
node_modules
.DS_Store
dist
# node-waf configuration
.lock-wscript
# Compiled binary addons (http://nodejs.org/api/addons.html)
build/Release
.dockerignore
Dockerfile
*docker-compose*
# Logs
logs
*.log
# Runtime data
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw*
pids
*.pid
*.seed
.git
.hg
.svn
![在这里插入图片描述](https://img-blog.csdnimg.cn/199c7619b4014c8a93ab06dadf546793.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
端口号更改/与dockerfile暴露端口一直
![在这里插入图片描述](https://img-blog.csdnimg.cn/653329906ba042c38ad13a6158616399.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
前端项目生产地址配置
![在这里插入图片描述](https://img-blog.csdnimg.cn/175667fadccc438083fe437abe863f7e.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
docker build -t web:1.0 .
打包前端镜像 -t就是 -tag .就是根目录下的dockerfile ![在这里插入图片描述](https://img-blog.csdnimg.cn/d33b9a46373845f9b00149cab81c488c.png)
Docker Desktop
![在这里插入图片描述](https://img-blog.csdnimg.cn/6fb44697cef440bc823f345b648764e8.png)
![在这里插入图片描述](https://img-blog.csdnimg.cn/d55df5f30eab443f9f6eb57a82fb06e5.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
镜像构建过程
![在这里插入图片描述](https://img-blog.csdnimg.cn/3cf6b4e68cd8487aae9abde423534a8a.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/aafc9d3aa7dc46d398612c3e4ab92224.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
docker images
![在这里插入图片描述](https://img-blog.csdnimg.cn/09fd8140adcc410ab8d911ddf572ef4f.png)
docker run -itd --name web -p 11000:80 web:1.0
![在这里插入图片描述](https://img-blog.csdnimg.cn/bcbb3aa97f084975847015f81a6aaa84.png)
浏览器输入localhost:11000
![在这里插入图片描述](https://img-blog.csdnimg.cn/dcd2e09b25af41a0b534cd495c6b11eb.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/fda1a4f018f3428f9d324e17a6e0cce4.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
Jenkins任务配置
前端项目配Deploy keys/Jenkins
![在这里插入图片描述](https://img-blog.csdnimg.cn/b79b5ed8d5124f1a8520daece58daa63.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/51a76f06f2e24247a50907cd06843c86.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/e7beff29415a403eb9c8148b642f461c.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
![在这里插入图片描述](https://img-blog.csdnimg.cn/0a677d3681314b9fa21af5ad38f88c4f.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/03d9b0550a804a12a1f1307052eff4e6.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
gitlab项目配置webhooks
![在这里插入图片描述](https://img-blog.csdnimg.cn/8fe89436de5444bdad70fe99d4b28305.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
![在这里插入图片描述](https://img-blog.csdnimg.cn/eb37b099923f48a286d601e96b421fa5.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/2e923a37641a47caa4727302d8b99169.png)
jenkins配置
![在这里插入图片描述](https://img-blog.csdnimg.cn/322e6461ef7a4c4face575e58fd9e527.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
![在这里插入图片描述](https://img-blog.csdnimg.cn/9334a602bbaa4a2a9f5de80e0faf6c9a.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
模拟
![在这里插入图片描述](https://img-blog.csdnimg.cn/907fece43aba4fdaa36f972b54b1a6fe.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
后端项目配置jenkins
![在这里插入图片描述](https://img-blog.csdnimg.cn/77c2db95a35742eea0eff2f9cf6bb9b3.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/bab1275ea22043e191e0ea991940b743.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/101a690355c744f4944c6b80727f9aee.png)
![在这里插入图片描述](https://img-blog.csdnimg.cn/1671162e35f7434b8e11c45df623f28d.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
测试
![在这里插入图片描述](https://img-blog.csdnimg.cn/53e0bf8272154a0b893744adb7344637.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/af0f0ac468a24888b2fab6a93da4d970.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
注意(私钥) ![在这里插入图片描述](https://img-blog.csdnimg.cn/d66244a5c7044b05a5a8a30b8d43085a.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
gitlab是管理员配置shh 公钥 启用即可 ![在这里插入图片描述](https://img-blog.csdnimg.cn/5371abe3d1c54d1293d7de7e44de27cc.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
Shell脚本
简单添加变量
#!/bin/bash
CONTAINER=${container_name}
PORT=${port}
echo $CONTAINER
echo $PORT
echo "hello imooc-front"
![在这里插入图片描述](https://img-blog.csdnimg.cn/fccfa5f5b9404b188a138ea20326c619.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
![在这里插入图片描述](https://img-blog.csdnimg.cn/0fc28bf40eef4c919f032d1f4eebae43.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/93e8aef4a3d244d8a75210293890ee46.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/f21c447164a0433a86a6dda576c0d58a.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/4b648a2b152d465381d845f1c20aee7b.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/a5524580aa264793913b53a14eeb1cdb.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
docker build --no-cache -t
i
m
a
g
e
n
a
m
e
:
{image_name}:
imagen?ame:{tag}
![在这里插入图片描述](https://img-blog.csdnimg.cn/a005ceffdede4ed69bfaca19ff43799d.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/8ff95c4587f348289cd19838d5cd4e93.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/f80a2aa9c66b4e59ac1a213133667327.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
docker run -itd --name $CONTAINER -p $PORT:80
i
m
a
g
e
n
a
m
e
:
{image_name}:
imagen?ame:{tag}
![在这里插入图片描述](https://img-blog.csdnimg.cn/5802173206c248d8a531e13b2988ccd9.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_Q1NETiBA5o6i6bG85LiN5piv6bG8,size_16,color_FFFFFF,t_70,g_se,x_16)
![在这里插入图片描述](https://img-blog.csdnimg.cn/30192fcfcc7f4a20bdd2d11bfd0b20ee.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_Q1NETiBA5o6i6bG85LiN5piv6bG8,size_50,color_FFFFFF,t_70,g_se,x_16)
docker run --name jenkins_one -itd -p 11006:8080 -p 50001:50000 -v /var/run/docker.sock:/var/run/docker.sock -v /usr/bin/docker:/usr/bin/docker jenkins/jenkins:lts
jenkins挂载docker
chmod 777 /var/run/docker.sock
授权 ![在这里插入图片描述](https://img-blog.csdnimg.cn/3db265fbd9b54a869f439a230b342df5.png)
docker inspect 容器名称
所有镜像运行状态
![在这里插入图片描述](https://img-blog.csdnimg.cn/2fb1c98f8e174dfd949e61686ced3aa2.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_Q1NETiBA5o6i6bG85LiN5piv6bG8,size_21,color_FFFFFF,t_70,g_se,x_16)
正在运行就停止
#!/bin/bash
CONTAINER=${container_name}
PORT=${port}
# echo $CONTAINER
# echo $PORT
# 完成了镜像的构建
# docker build -t web:1.0 .
docker build --no-cache -t ${image_name}:${tag} .
# 跑起来我们的服务 -itd 在后台执行
docker run -itd --name $CONTAINER -p $PORT:80 ${image_name}:${tag}
# echo "hello imooc-front"
RUNNING=${docker inspect --format="{{ .State.Running}}" $CONTAINER 2 > /dev/null}
# 条件判断
if[ ! -n $RUNNING ]; then
echo "$CONTTINER does not exit"
return 1
fi
![在这里插入图片描述](https://img-blog.csdnimg.cn/2c77e8d7aaeb44e9bb6958ec7f0fb44c.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_Q1NETiBA5o6i6bG85LiN5piv6bG8,size_28,color_FFFFFF,t_70,g_se,x_16) ![在这里插入图片描述](https://img-blog.csdnimg.cn/c915413acea942cbb9d3d61c56613814.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_Q1NETiBA5o6i6bG85LiN5piv6bG8,size_48,color_FFFFFF,t_70,g_se,x_16)
最终判断
#!/bin/bash
CONTAINER=${container_name}
PORT=${port}
# echo $CONTAINER
# echo $PORT
# 完成了镜像的构建
# docker build -t web:1.0 .
docker build --no-cache -t ${image_name}:${tag} .
# echo "hello imooc-front"
RUNNING=`docker inspect --format="{{ .State.Running}}" $CONTAINER `
echo $RUNNING
# 条件判断
if [ ! -n $RUNNING ]; then
echo "$CONTAINER does not exit"
return 1
fi
if [ "$RUNNING" == "false" ]; then
echo "$CONTAINER is not running"
return 2
else
echo "$RUNNING is running"
# delete same name container
matchingStarted=$(docker ps --filter="name=$CONTAINER" -q | xargs)
if [ -n $matchingStarted ]; then
docker stop $matchingStarted
fi
matching=$(docker ps -a --filter="name=$CONTAINER" -q | xargs )
if [ -n $matching ]; then
docker rm $matching
fi
fi
echo "RUNNING is ${RUNNING}"
# 跑起来我们的服务 -itd 在后台执行
docker run -itd --name $CONTAINER -p $PORT:80 ${image_name}:${tag}
![在这里插入图片描述](https://img-blog.csdnimg.cn/897ede276517409c900346d759e87d81.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_Q1NETiBA5o6i6bG85LiN5piv6bG8,size_28,color_FFFFFF,t_70,g_se,x_16)
放行
![在这里插入图片描述](https://img-blog.csdnimg.cn/859681587caf432da7b7eb3bc4ec1981.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_Q1NETiBA5o6i6bG85LiN5piv6bG8,size_39,color_FFFFFF,t_70,g_se,x_16)
Travis CI
github登录travis并且创建github仓库
![在这里插入图片描述](https://img-blog.csdnimg.cn/8650c07e00c2485ea1020906390b85be.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
创建vue项目关联仓库
![在这里插入图片描述](https://img-blog.csdnimg.cn/8921122618be40abb7c824c86d86575d.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/039b6d508369414ebedc4de6dc0ef328.png)
根目录配置travis.yml文件
language: node_js
node_js:
- "14.15.1"
cache:
yarn: true
install:
- yarn intall
script:
- npm run build
![在这里插入图片描述](https://img-blog.csdnimg.cn/b9835da5500e43098ce823ea8b1ba8f4.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
第一次提交代码
![在这里插入图片描述](https://img-blog.csdnimg.cn/abeccec31d174321bc3cb5b5c22f776c.png)
同步travis
![在这里插入图片描述](https://img-blog.csdnimg.cn/19e1822eacb04900b05477eb4080d390.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
手动构建一次
![在这里插入图片描述](https://img-blog.csdnimg.cn/08ccc853bc0e46d9a8354fc720b9e1bd.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/5f9a64fe75e2467692ceb0c86a0be991.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/1f1f644c31df4398894f73b6923b213e.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/0a4531a2d46f45678f0b94170e4ea73a.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
发布到github pages
![在这里插入图片描述](https://img-blog.csdnimg.cn/f585f1bcbc2e478d95f1410945746b8f.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
deploy:
provider: pages
skip_cleanup: true
local_dir: dist/
github_token: $GITHUB_TOKEN # Set in the settings page of your repository, as a secure variable
keep_history: true
name: "zeroWk"
email: xxxxxxxx@163.com
on:
branch: master
根目录vue.config.js
module.exports = {
publicPath: process.env.NODE_ENV === "production" ? "/travisci-demo" : "/"
}
![在这里插入图片描述](https://img-blog.csdnimg.cn/d0203efad02e4afcaddb280e326ef53d.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
github申请token
![在这里插入图片描述](https://img-blog.csdnimg.cn/0fd31d526d37452b8a3ba29c61f5f51c.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/d877a273992e4d82bad7a866129e9785.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/db511d81e4d441628ec6ba7eaef6893a.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
设置travis变量
![在这里插入图片描述](https://img-blog.csdnimg.cn/9e554a8c307a46d9bf560bb0fd35776b.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/fa7c9a858cc84c59bdbeb279bea972e9.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
提交代码
![在这里插入图片描述](https://img-blog.csdnimg.cn/5582156ba88d4c16abbbee52c4d53633.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/98c982e2e7b4445e8d7d0001df9a19a5.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/a562ccbe11d74065ad9a2fe571080bdd.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/91abbca05c9f4d87ac096391976c2193.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
githubPages
![在这里插入图片描述](https://img-blog.csdnimg.cn/684449886a1a4cbea31e9fa702689213.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/228dbe76bbb5474da224a6fd866e81b8.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
总结
![在这里插入图片描述](https://img-blog.csdnimg.cn/9a4c6ec553974d968b995c53085d7a46.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
Ciecle CI
github登录
![在这里插入图片描述](https://img-blog.csdnimg.cn/ca0c15a3d076440297376f88740e4ec9.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
github创建仓库
要是公共项目才可以 ![在这里插入图片描述](https://img-blog.csdnimg.cn/244a0ecbe4b4410fb7cf4ee7cad616d6.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
本地拉取仓库
![在这里插入图片描述](https://img-blog.csdnimg.cn/a31e4c9300fe4245b74d4c4b8e2ec9e5.png)
创建.circleci文件夹/config.yml
![在这里插入图片描述](https://img-blog.csdnimg.cn/8ae8fe4609524254b71034bc60a0020c.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
version: 2.1
jobs:
build:
docker:
- image: circleci/node:14-browsers
steps:
- run: echo 'A first hello'
- run: npm -v
上传代码
git add . git commit -m “add” git remote add origin https://github.com/xxxxx git branch -M main git push -u origin main
![在这里插入图片描述](https://img-blog.csdnimg.cn/c36430495a654ddaa4ef888c71a4ee86.png)
刷新circleci
![在这里插入图片描述](https://img-blog.csdnimg.cn/f92127510f184e23b9cd5b0a23866f7a.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
set Up Project
![在这里插入图片描述](https://img-blog.csdnimg.cn/c92d5bf7703c4826b2f1d2823687c12c.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
vue create circle-demo1
创建一个项目,将demo1中的文件复制到demo中 ![在这里插入图片描述](https://img-blog.csdnimg.cn/90a4a24e74874b4ca2c0b9ca1867e663.png)
设置远程拉取代码分支branchs
![在这里插入图片描述](https://img-blog.csdnimg.cn/4fde95ea03834227908a2f5f35b059eb.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
![在这里插入图片描述](https://img-blog.csdnimg.cn/201168399ad94b1c97a15835daa424d9.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/be038fa49f3b4047803eaab653feec98.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/76eba5b16d5146338e74dd1d42f8077d.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/c9720b303eeb4273bd51960e71456ea0.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
配置config.yml
version: 2.1
jobs:
build:
docker:
- image: circleci/node:14-browsers
only:
- main
steps:
- add_ssh_keys:
fingerprintts:
- "13:12:94:88:0c:94:ec:70:f0:5e:3a:15:71:e9:d4:a0"
- checkout
- run:
name: Install
command: yarn install
- run
name: Build
command: yarn build
![在这里插入图片描述](https://img-blog.csdnimg.cn/a8505643bcdc49c08be34c1a1ec4d33a.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
提交代码
![在这里插入图片描述](https://img-blog.csdnimg.cn/1413da13b27a4d2f8abebd78e5e02288.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/1f878136fa62483396ce2e22483721ea.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) 缩进 ![在这里插入图片描述](https://img-blog.csdnimg.cn/81952a73f6d640369daaa465b1870573.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
保存/复用缓存
![在这里插入图片描述](https://img-blog.csdnimg.cn/6e651b596eab4dc891935ca77f7156a3.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
script文件件/deploy.sh 脚本
sh脚本就相当于一个函数 return不同值
#!/bin/sh
# 构想 https://gist.github.com/motemen/8595451
# 基于 https://github.com/eldarlabs/ghpages-deploy-script/blob/master/scripts/deploy-ghpages.sh
# MIT许可 https://github.com/eldarlabs/ghpages-deploy-script/blob/master/LICENSE
# abort the script if there is a non-zero error
set -e
# 打印当前的工作路径
pwd
remote=$(git config remote.origin.url)
echo 'remote is: '$remote
# 新建一个发布的目录
mkdir gh-pages-branch
cd gh-pages-branch
# 创建的一个新的仓库
# 设置发布的用户名与邮箱
git config --global user.email "$GH_EMAIL" >/dev/null 2>&1
git config --global user.name "$GH_NAME" >/dev/null 2>&1
git init
git remote add --fetch origin "$remote"
echo 'email is: '$GH_EMAIL
echo 'name is: '$GH_NAME
echo 'sitesource is: '$siteSource
# 切换gh-pages分支
if git rev-parse --verify origin/gh-pages >/dev/null 2>&1; then
git checkout gh-pages
# 删除掉旧的文件内容
git rm -rf .
else
git checkout --orphan gh-pages
fi
# 把构建好的文件目录给拷贝进来
cp -a "../${siteSource}/." .
ls -la
# 把所有的文件添加到git
git add -A
# 添加一条提交内容
git commit --allow-empty -m "Deploy to GitHub pages [ci skip]"
# 推送文件
git push --force --quiet origin gh-pages
# 资源回收,删除临时分支与目录
cd ..
rm -rf gh-pages-branch
echo "Finished Deployment!"
![在这里插入图片描述](https://img-blog.csdnimg.cn/1ab6a4f45f3449dab3a0cae2410703df.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
配置脚本
![在这里插入图片描述](https://img-blog.csdnimg.cn/6fcd02a190ea42059c0882384ed2c492.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/a22056eae3d343358e332ac14f806d09.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
circleci配置环境变量
![在这里插入图片描述](https://img-blog.csdnimg.cn/5d2e0c6584b446e0b3105fda282bae7a.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/fbd8b4a8d5334be6ac5803c7e618f652.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/e6e521a43e55479aa6c34a169613d544.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/1684139cbd92469d9b1d438c360081c0.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) 重新构建 ![在这里插入图片描述](https://img-blog.csdnimg.cn/f167ca56db83415fa5b11fe7124b6a90.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
课程完整版config.yml
version: 2
jobs:
build:
docker:
- image: circleci/node:10
branches:
only:
- master
steps:
- add_ssh_keys:
fingerprints:
- "94:e5:20:73:dd:b1:6a:51:e1:b5:fb:5f:24:82:0d:15"
- checkout
- restore_cache:
keys:
- dependencies_imooc
- run:
name: Install
command: yarn install
- save_cache:
paths:
- node_modules
key: dependencies_imooc
- run:
name: Build
command: yarn build
- run:
name: Prepare shell commands
# shell chmod +x 赋予执行权限
# 执行shell脚本
command: chmod +x scripts/deploy.sh
- run:
name: Run Deploy to Github pages
command: ./scripts/deploy.sh
github pages
项目 —> setting --> ![在这里插入图片描述](https://img-blog.csdnimg.cn/2147f8400e384c609c93d8ee507a7707.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/f3a16fd5103741f1818485bd3a862889.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
上面的ciecle-demo找不到因为webpack配置原因 ![在这里插入图片描述](https://img-blog.csdnimg.cn/da9d72a029e14741b68a37fa1bff0ee8.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70) ![在这里插入图片描述](https://img-blog.csdnimg.cn/decbb1969edf4fd78e93edd8743b37dd.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
总结
![在这里插入图片描述](https://img-blog.csdnimg.cn/6545ca73d4674bfab92f524939284ef6.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JvbGxzUm95Y2V3aw==,size_16,color_FFFFFF,t_70)
|