热点新闻
前端工程化:保姆级教学 Jenkins 部署前端项目
2023-07-25 04:35  浏览:1732  搜索引擎搜索“手机闹展网”
温馨提示:信息一旦丢失不一定找得到,请务必收藏信息以备急用!本站所有信息均是注册会员发布如遇到侵权请联系文章中的联系方式或客服删除!
联系我时,请说明是在手机闹展网看到的信息,谢谢。
展会发布 展会网站大全 报名观展合作 软文发布





DevOps

提到 Jenkins,想到的第一个概念就是 CI/CD 在这之前应该再了解一个概念。

DevOps DevelopmentOperations 的组合,是一种方法论,并不特指某种技术或者工具。DevOps 是一种重视 Dev 开发人员和 Ops 运维人员之间沟通、协作的流程。通过自动化的软件交付,使软件的构建,测试,发布更加的快捷、稳定、可靠。

CI

CI 的英文名称是Continuous Integration,中文翻译为:持续集成。

试想软件在开发过程中,需要不断的提交,合并进行单元测试和发布测试版本等等,这一过程是痛苦的。持续集成CI是在源代码变更后自动检测、拉取、构建的过程。






CD

CD 对应两个概念 持续交付Continuous Delivery 持续部署Continuous Deployment

持续交付

提交交付顾名思义是要拿出点东西的。在 CI 的自动化流程阶段后,运维团队可以快速、轻松地将应用部署到生产环境中或发布给最终使用的用户。

从前端的角度考虑,在某些情况下肯定是不能直接通过自动化的方式将最终的 build 结果直接扔到生产机的。持续交互就是可持续性交付供生产使用的的最终 build。最后通过运维或者后端小伙伴进行部署。






持续部署

作为持续交付的延伸,持续部署可以自动将应用发布到生产环境。






Jenkins 安装

示例服务器为 阿里云 CentOS 服务器。安全组中增加 8080 端口 Jenkins 默认占用

Jenkins 安装大体分两种方式,一种使用 Docker 另一种则是直接安装,示例选择后者。不管使用哪种方式安装,最终使用层面都是一样的。 Linux 安装, Docker 安装

<details><summary>点击查看Linux安装过程</summary>

# 下载 Jenkins 资源 sudo wget -O /etc/yum.repos.d/jenkins.repo https://pkg.jenkins.io/redhat/jenkins.repo # 获取并导入信任 的包制作者的秘钥 sudo rpm --import https://pkg.jenkins.io/redhat/jenkins.io.key # 升级 yum 源中的所有包 sudo yum upgrade # Jenkins 依赖于 java 所以需要安装 JDK sudo yum install java-11-openjdk # 安装 Jenkins sudo yum install jenkins 复制代码

如果最终 Jenkins 没有找到包而导致没有安装成功,检查第一步和第二部执行结果并重新执行。

可以使用 systemctl 命令管理 Jenkins 服务 systemctl

# 启动 Jenkins 服务 systemctl start jenkins # 重启 Jenkins 服务 systemctl restart jenkins # 停止 Jenkins 服务 systemctl stop jenkins # 查看 Jenkins 服务状态 systemctl status jenkins 复制代码

启动服务后访问服务器地址 + 8080 端口,Jenkins 默认为 8080 端口。</details>

Jenkins 使用及 Freestyle 任务构建






首次进入使用 cat /var/lib/jenkins/secrets/initialAdminPassword 查看密码。

随后进入插件安装页面,暂时安装系统推荐插件即可。

然后创建用户






构建目标:拉取 github 代码

点击 新建 Item 创建一个 Freestyle Project






源码管理 处选择 git ,输入仓库地址,点击添加。






输入 github 账号和密码,这里的密码有时候可能会出现问题,可以使用 token github 如何生成 token ?

配置只是一方面,同时服务器也要具备 git 环境。 yum install git






构建目标:部署到本机

部署前端项目肯定是离不开 nginx 的。 yum install nginx

安装完成后同样可以使用 systemctl 命令管理 nginx 服务。

nginx 具体配置这里就不说了。本示例项目中,静态文件托管目录为 /usr/share/nginx/html/dist

接着来到 Jenkins 这里。想要部署前端项目还需要依赖一个 Node 环境,需要在 Manage Jenkins -> Manage Plugins 在可选插件中搜索 nodejs 选择对应插件进行安装,安装完成后需要重启才会生效。






然后到 系统管理 -> 全局工具配置 中配置 Node (吐槽:没有安装任何插件时系统管理以及其子页面全是英文,安装完插件后又变成了中文。这国际化不知道是系统原因还是它的原因

发布人:a22c****    IP:117.173.39.***     举报/删稿
展会推荐
让朕来说2句
评论
收藏
点赞
转发