前端进阶之旅前端进阶之旅
基础篇
进阶篇
高频篇
精选篇
手写篇
原理篇
面经篇
自检篇
每日一题
  • 综合
    • 综合题型
    • 其他问题
    • 设计模式
    • 思维导图
    • 学习路线
  • 前端基础
    • HTTP
    • 浏览器
    • 计算机基础
  • 进阶学习
    • NPM工作流
    • Docker
    • Canvas
    • Node学习指南
    • 前端综合文章
  • 其他
    • Handbook
    • 职场话题
    • CSS可视化
小程序题库
公众号动态
博客动态
开发者导航
基础篇
进阶篇
高频篇
精选篇
手写篇
原理篇
面经篇
自检篇
每日一题
  • 综合
    • 综合题型
    • 其他问题
    • 设计模式
    • 思维导图
    • 学习路线
  • 前端基础
    • HTTP
    • 浏览器
    • 计算机基础
  • 进阶学习
    • NPM工作流
    • Docker
    • Canvas
    • Node学习指南
    • 前端综合文章
  • 其他
    • Handbook
    • 职场话题
    • CSS可视化
小程序题库
公众号动态
博客动态
开发者导航

Jenkins部署微前端方案实践总结

首页
2021-11-17 10:35:08
Front-End
微前端

# 持续集成

集成工具 jenkins 的基本介绍和自动化部署微前端项目的几个简单方案

# 一、Jenkins 基础介绍

Jenkins 是国际上流行的免费开源软件项目,是基于 Java 开发持续集成工具,用于监控持续重复的工作,旨在提供一个开放的易用的软件平台,使软件的持续集成自动化,大大节约人力和时效。

Jenkins 功能包括:

  • 持续的软件版本发布/测试项目。
  • 监控外部调用执行的工作。

# 1. 系统管理

安装好的 jenkins 可以在系统管理进行配置系统信息等

  • 系统设置

    • 执行者数量:系统可同时并发执行任务的数量,系统默认 2 个,原则上不超过服务器 CPU 核数,否则容易出现 CPU 利用率过载导致服务挂掉。
    • Jenkins URL:Jenkins 访问地址,可以修改地址的端口号,和修改服务器配置文件的端口号效果一致
  • 凭据配置

    • 凭据可以用来存储需要密文保护的数据库密码、Gitlab 密码信息、Docker 私有仓库密码等,以便 Jenkins 可以和这些第三方的应用进行交互,需要安装 Credentials Binding 插件,用户才可管理凭据
  • 凭据管理

    • 凭据管理包含凭据的管理和凭据所在域的管理,系统默认会创建全局域,用户可以在两个管理表格的存储下添加域,在用户选择的域下添加凭据或者进入域详情添加凭据。为了最大程度地提高安全性,在 Jenkins 中配置的凭据以加密形式存储在主 Jenkins 实例上(由 Jenkins 实例 ID 加密),用户需要使用配置的唯一标识 ID 进行处理。
    • 可以添加的凭证有 5 种:
      1. 用户名和密码
      2. SSH 密钥(SSH 公私钥对)
      3. 加密文件
      4. 令牌(例如 API 令牌、GitHub 个人访问令牌)
      5. 证书
    • 添加凭据:
      1. 种类
      2. 范围 (全局、系统)
      3. 凭据
      4. ID (此字段是可选的。如果未指定其值,Jenkins 将为凭证 ID 分配一个全局唯一 ID(GUID)值。请记住,一旦设置了凭证 ID,就无法再更改它)
      5. 凭证描述。
  • 插件管理

    Jenkins 提供了两种不同的方法来在主服务器上安装插件:

    • 在管理平台界面中使用插件管理器

      通过“系统管理” >“插件管理”视图,Jenkins 环境的管理员可以使用该视图。在“ 可选插件 ”选项卡下,可以搜索用户需要的插件,搜索到需要的插件后勾选插件列表的选中框,之后点击左下角的下载并且重启后安装,等待插件下载完成后服务自动重启,重新进入系统即安装成功。

    • 使用 Jenkins CLI install-plugin 命令

      管理员还可以使用 Jenkins CLI,它提供了安装插件的命令。用于管理 Jenkins 环境的脚本或配置管理代码可能需要安装插件,而无需在 Web UI 中直接进行用户交互。Jenkins CLI 允许命令行用户或自动化工具下载插件及其依赖项

  • 管理用户

    Jenkins 默认使用自带数据库模式存储用户,jenkins 默认创建 admin 账号,默认密码位于 /var/lib/jenkins/secrets/initialAdminPassword,登录之后可在管理用户修改用户默认密码

# 2. 新建视图

视图功能主要用于管理不同项目之间的任务,每个项目创建一个视图并在视图下管理整个项目的模块。

  • 列表视图(显示简单列表。新建或编辑视图的时候可以选择将当前已有的任务添加到该视图,也可以在该视图下新建任务)
  • 我的视图(该视图自动显示当前用户有权限访问的任务)

# 3. 任务

  • 新建任务
    • 任务名称
    • 任务模板:jenkins 提供的任务模板,一般新安装的 jenkins 只会有一个“构建一个自由风格的软件项目”模板,而如果需要其他的任务模板需要用户下载对应的插件,不同的任务模板会有不同的构建流程
    • 复制:可选项,用户可以输入已有的任务名称选择其中之一复制一个新的任务,选择了复制的任务后就无法自定义任务模板,以复制的项目的任务模板为主
  • 任务详情
    • 状态
    • 修改记录:每次构建获取的代码变更记录,即记录每次构建的 git 仓库提交记录
    • 工作空间:任务的工作空间的项目文件目录
    • 立即构建:执行构建部署任务,使用不同的插件执行构建过程会有差异
    • 配置:配置整个任务构建和部署过程的需要干什么
    • 删除工程
    • 重命名

# 二、任务配置

任务配置主要将自动化构建部署从项目的获取到部署成功的一个过程需要做的工作做分解配置。

# 1. General

这一步主要是在执行构建前对 jenkins 配置进行了简单的设置

  • 描述

  • 丢弃旧的构建

    • 策略:默认 Log Rotation
      • 保持构建的天数:将保存此天数的构建记录,为空保存所有
      • 保持构建的最大个数:保存最近该个数的构建,为空保存所有
  • 参数化构建过程

    Extended Choice Parameter 插件,该插件可以使用多选框,利用该插件可以指定需要打包的应用,而不需要打包所有项目,减少打包时间

    • Name:构建过程使用的参数名
    • Description:参数描述
    • Basic Parameter Types
      • Parameter Type:Check Boxes (值使用的类型)
      • Number of Visible Items:8 checkbox 参数值个数(项目子包和主包个数)
      • Delimiter:, 各个值的分割符号
      • Choose Source for Value:main,subs/appletuser,subs/college,subs/follow,subs/project,subs/questions,subs/statistics,subs/system 参数值(主包和子包相对项目路径
      • Choose Source for Default Value:main,subs/appletuser,subs/college,subs/follow,subs/project,subs/questions,subs/statistics,subs/system 参数默认选中的值(主包和子包相对项目路径

    布尔值参数,true/false 值的参数,当前应用于构建过程中判断是否需要构建 npm install

    • 名称:构建过程使用的参数名
    • 默认值:默认是否勾选
    • 描述:参数描述

# 2. 源码管理

  • Git plugin

    GIT 仓库管理插件,用于同步 git 库,通过该插件 jenkins 任务可以在构建过程中获取配置好的 git 远程仓库代码,任务执行时代码会被拉取到/var/lib/jenkins/workspace/{任务名称}目录下

    • Repository URL 代码仓库地址
    • Credentials 服务器连接代码仓库的凭据,可在系统管理添加后选择,也可以在右边的添加按钮新增凭据,新增方式和系统管理的凭据新增一样
    • Branches to build 指定任务需要拉取的分支,允许配置多个分支
    • 源码库浏览器 指定 git 仓库类型,默认自动

# 3. 构建

  • 执行 shell

    开始执行构建任务之前源码管理插件已经将代码从远程库中获取,执行 shell 任务主要通过获取参数化构建时设置的参数去对整个项目中的各个应用进行打包并将打包完成的部署文件统一放在根目录的发布文件夹publish,执行详细代码如下:

    #!/bin/bash
    
    fe
    • 持续集成
      • 一、Jenkins 基础介绍
        • 1. 系统管理
        • 2. 新建视图
        • 3. 任务
      • 二、任务配置
        • 1. General
        • 2. 源码管理
        • 3. 构建
        • 4. 构建后操作
      • 三、构建
        • 1. 构建前
        • 2. 构建后
      • 四、 Jenkins部署微前端多个包完整配置
        • 需要安装的插件
      • 五、使用阿里云OSS部署微前端项目
        • 一、创建 Bucket 存储桶
        • 1. 进入对象存储 OSS 服务
        • 2. 创建 Bucket 存储桶
        • 二、添加 CDN 域名
        • 1. 进入 CDN 服务
        • 2. 添加 CDN 域名
        • 3. HTTPS 配置
        • 4. 得到 CNAME 域名
        • 三、添加 CNAME 记录
        • 1. 进入云解析 DNS 服务
        • 2. 添加 CNAME 记录
        • 四、设置存储桶
        • 1. 缓存设置
        • 2. 设置静态页面
        • 1. 域名管理
        • 五、上传代码至存储桶
        • 1. 下载 oss browser 工具

    ← Git开发流程分支管理方案serverless及小程序云开发实践总结 →