国产 Dev/Ops 工具 Jpom 的前端项目自动化部署实践

卸任
807 阅读4分钟

前言

之前写过两篇文章从 WebHooks实现项目CI/CD 到 # WebHooks配合Docker实现项目CI/CD，项目从CI/CD上得到质的变化，但是跟正真公司中项目自动化部署还是有不小的差距。今天就来试一下正规的项目自动化部署。我们公司是从Jenkins到Jpom的，所以我也是从Jpom入手，研究一下。

在我看来CI/CD只是 Dev/Ops 实践的一部分。Jpom的官网是这么说的

我们致力于为您提一款简而轻的低侵入式、在线构建、自动部署、日常运维、项目运维/监控软件。

正文

Jpom的部署

Jpom有Server端和Agent端需要安装,我们直接使用自动化安装服务命令就可以了

Server端

curl -fsSL https://jpom.top/docs/install.sh | bash -s Server jdk+default+service

Agent端

curl -fsSL https://jpom.top/docs/install.sh | bash -s Agent jdk+default+service

安装后我们就可以直接开始使用了，Jpom 服务端的默认端口是2122。此时您只需要在浏览器地址栏输入：http://您服务器的IP:2122， 即可访问到 Jpom 服务端。根据自己的喜好设置一个账号就可以。

image.png

这一步跳过就可以了

image.png 之后你可以正常的使用账号登录了

image.png

我们还可以通过设置Nginx，使得可以通过域名来访问。xxx为你所设置的域名解析值。这样我们就可以通过域名来访问了，而不是IP。

server {
    listen 80 default_server; 
    server_name   xxx.你的域名;
    index index.html;
    location / {
      proxy_pass http://127.0.0.1:2122;
    }
  }

切换目录

通过这个按钮可以切换不同的目录，系统目录和功能管理

image.png

创建工作空间

工作空间可以这么理解，按环境分的话可以分为dev工作空间、test工作空间、prod工作空间，按前后端来分的话可以分为前端工作空间、后端工作空间。这个看你自己。

image.png

创建机器

创建完工作空间后，我们还需要一个机器，先来创建一个机器。

image.png

节点密码可以到这个文件夹下查看

/usr/local/jpom-agent/data/agent_authorize.json

为机器分配工作空间

有了工作空间和机器还不够，还需要将工作空间和机器进行关联。

image.png

这样切换不同的工作空间，相当于切换不同的机器。

image.png

创建项目仓库

我们需要创建项目仓库，这样才知道从哪里拉取代码。按照要求填写就行了。

image.png

设置项目构建配置

进入构建列表目录，新增一个构建项目，选择本地构建。

image.png

选择构建的仓库和分支

image.png

根据自己项目配置，编写构建的命令。项目比较多时，你也可以选择引入脚本模板，脚本模板里面还是写拉取依赖和项目打包命令

image.png

选择发布发布方式，我试了两种项目发布和SSH发布

image.png

项目发布
  1. 新增项目

image.png

  1. 选择项目

image.png

  1. 保存发布就行

image.png

SSH发布
  1. 新增SSH

image.png

  1. 配置路径

也是相当于设置项目在服务器中的位置

image.png

  1. 选择SSH

image.png

  1. 下一步保存发布就可以了

构建项目

当项目构建配置完后以后就只要点击直接构建就可以了，它就会自动的拉取远程代码然后打包。

image.png

构建完的项目，会出现在你项目发布和SSH发布所配置的目录下

image.png

最后只需要在服务器中设置网站的根目录为配置目录就可以了。

分支合并自动打包部署

在构建编辑中我们可以找到这个触发器，我们只要向这个地址发送请求，项目就可以自动构建。我们也就可以看到最新的页面。

这里需要WebHooks的帮助，WebHooks实现项目CI/CD 可以参考，只需要将打包脚本变为发送请求就可以了。还有一点很重要，我们对dev和test环境的代码可以自动的发版，对于生产环境的代码，我们可以选择手动发版（不使用触发器，而是需要发版的时候，点一下直接构建），这样做也是为了保险。

image.png

结语

Jpom的功能还有很多很多，对于前端项目的自动化部署来说，以上的内容就够了，剩下感兴趣的可以自己去试试。

avatar
文章
阅读
粉丝