自定义 Github Action 库实战详解

目录
  • auto-push-oss Action
    • 添加依赖、编译脚本、action.yml配置:
      • 添加必要依赖:
      • 添加编译脚本:
      • 编写 action.yml 配置文件:
    • 编写自述文档:
      • auto-push-oss
      • Inputs
      • Example usage
    • 编写indnex.js脚本:
      • 提供path、fs、ali-oss 和获取 yml 参数的@actions/core依赖~
      • 通过@actions/core提供的getInput来获取 yml 配置的参数变量~
      • OSS 推送文件主脚本
  • use auto-push-oss
  • 总结

auto-push-oss Action

虽然在 Github 市场有推送 OSS 相关的 Action,但是我还是选择改造我运行了好多年的脚本来自定义符合自己要求的 Action 库。

编写步骤:

  • 添加依赖、编译脚本、action.yml配置
  • 编写自述文档
  • 编写indnex.js脚本

添加依赖、编译脚本、action.yml配置:

添加必要依赖:

"@actions/core": "^1.9.1"		// 读取 yml 参数
"@vercel/ncc": "^0.34.0"    // 打包脚本
"ali-oss": "^6.17.1"        // ali-oss依赖

添加编译脚本:

"build": "ncc build index.js --license licenses.txt"

编写 action.yml 配置文件:

name: "auto-push-oss"
description: "自动推动目录到 OSS"
# 定义输入参数
inputs:
  root:
    description: "待推送路径"
    required: true
  bucket:
    description: "oss bucket"
    required: true
  region:
    description: "oss region"
    required: true
  accessKeyId:
    description: "oss accessKeyId"
    required: true
  accessKeySecret:
    description: "oss accessKeySecret"
    required: true
runs:
  # 脚本运行环境(按官方文档给的12版本来使用)
  using: "node12"
  # 脚本执行入口(这里我们要用@vercel/ncc编译)
  main: "dist/index.js"

编写自述文档:

自述文档需要说明这个 Action 的主要作用、需要配置的参数和最小使用的例子~

auto-push-oss

方便将常见的 Vue 项目,VuePress 项目构建到根目录的 dist 文件夹推送到指定从 oss 桶的根目录,特别适合在 oss 托管 VuePress 博客~

Inputs

参数 描述
root 待推送文件夹
bucket oss bucket
region oss region
accessKeyId oss accessKeyId
accessKeySecret oss accessKeySecret

Example usage

uses: OSpoon/auto-push-oss@main
with:
  root: public
  bucket: it200
  region: oss-cn-beijing
  accessKeyId: ${{secrets.accessKeyId}}
  accessKeySecret: ${{secrets.accessKeySecret}}

编写indnex.js脚本:

提供path、fs、ali-oss 和获取 yml 参数的@actions/core依赖~

const path = require("path");
const fs = require("fs");
const core = require("@actions/core");
const OSS = require("ali-oss");

通过@actions/core提供的getInput来获取 yml 配置的参数变量~

const root = core.getInput("root");
const bucket = core.getInput("bucket");
const region = core.getInput("region");
const accessKeyId = core.getInput("accessKeyId");
const accessKeySecret = core.getInput("accessKeySecret");

OSS 推送文件主脚本

// TODO 必要依赖
// TODO 接收输入参数
const client = new OSS({
  bucket,
  region,
  accessKeyId,
  accessKeySecret,
});
const rootPath = root || "dist";
const isHave = fs.existsSync(rootPath);
if (!isHave) {
  throw new Error("路劲不存在");
}
let filepaths = [];
let putCount = 0;
function readFileSync(filepath) {
  let files = fs.readdirSync(filepath);
  files.forEach((filename) => {
    let p = path.join(filepath, filename);
    let stats = fs.statSync(p);
    if (stats.isFile()) {
      filepaths.push(p);
    } else if (stats.isDirectory()) {
      readFileSync(p);
    }
  });
}
function put(filepath) {
  const p = filepath.replace(rootPath, "").substr(1);
  return client.put(p.replace("\", "/"), filepath);
}
async function update() {
  try {
    // 递归获取所有待上传文件路径
    readFileSync(rootPath);
    let retAll = await filepaths.map((filepath) => {
      putCount++;
      console.log(`任务添加: ${path.basename(filepath)}`);
      return put(filepath);
    });
    Promise.all(retAll).then((res) => {
      const resAll = res.map((r) => {
        return r.res.statusCode === 200;
      });
      if (Object.keys(resAll).length === putCount) {
        console.log("发布成功");
      }
    });
  } catch (e) {
    console.log(e);
  }
}
// 上传发布
update();

use auto-push-oss

下面这份配置就是将网站打包并推送 OSS 的工作流程,当监测到新代码 PUSH 到 Github 后就开始执行auto-push-2-oss工作流,分别是:

    • 第一步使用actions/checkout@v2拉取代码;
    • 第二步执行npm install && npm run build安装依赖并输出网站资源;
    • 第三步使用OSpoon/auto-push-oss@main推送网站资源到 OSS;

auto-push-oss@main需要配置我们在自述文档中提到的几个必要参数需要通过 with 配置,其中accessKeyId和accessKeySecret由于涉及到 OSS 的相关秘钥,不建议也不应该明文展示到 Github,所以需要使用到项目级别的环境变量。

name: push-2-oss
on: [push]
jobs:
  auto-push-2-oss:
    runs-on: ubuntu-latest
    steps:
      - name: checkout
        uses: actions/checkout@v2
      - name: install & build
        run: npm install && npm run build
      - name: push public oss
        uses: OSpoon/auto-push-oss@main
        with:
          root: public
          bucket: it200
          region: oss-cn-beijing
          accessKeyId: ${{secrets.accessKeyId}}
          accessKeySecret: ${{secrets.accessKeySecret}}

总结

编写完 Action 后成功也接入了 workflows ,往后就不再重复的执行构建命令和发布脚本了,只需要将修改的代码 PUSH 到 Github 后面的工作将自动完成~

本文项目已推送至GitHub,欢迎克隆演示:git clone git@github.com:OSpoon/auto-push-oss.git

以上就是自定义 Github Action 库实战详解的详细内容,更多关于Github Action 库自定义的资料请关注我们其它相关文章!

(0)

相关推荐

  • 使用 Github Actions 自动部署 Angular 应用到 Github Pages的方法

    前言 最近在学习 Angular,一些基础的语法也学习的差不多了,就在 github 上新建了一个代码仓库,准备用 ng-zorro 搭个后台应用的模板,方便自己以后写些小东西时可以直接使用.前端项目,最主要的还是能够实际看到,因此考虑找个地方部署,因为自己的博客是部署到 github page 上的,并且这个项目也只是一个静态网站,所以这里同样选择使用 github page 同时,考虑到发布项目时,虽然使用 github page 已经帮我们省略了拷贝文件到服务器上这一步,但是还是需要自己手

  • 使用CI/CD工具Github Action发布jar到Maven中央仓库的详细介绍

    之前发布开源项目Payment Spring Boot到Maven中央仓库我都是手动执行mvn deploy,在CI/CD大行其道的今天使用这种方式有点"原始".于是我一直在寻求一种能够支持流水线作业的发布工具,能让我在进行合并代码时自动触发构建发布.有一款免费的产品能做到这一点,它就是Github Action. Github Action Github Action是由Github创建的CI/CD服务. 它的目的是使所有软件开发工作流程的自动化变得容易. 直接从GitHub构建,测

  • 自定义 Github Action 库实战详解

    目录 auto-push-oss Action 添加依赖.编译脚本.action.yml配置: 添加必要依赖: 添加编译脚本: 编写 action.yml 配置文件: 编写自述文档: auto-push-oss Inputs Example usage 编写indnex.js脚本: 提供path.fs.ali-oss 和获取 yml 参数的@actions/core依赖~ 通过@actions/core提供的getInput来获取 yml 配置的参数变量~ OSS 推送文件主脚本 use aut

  • golang常用库之gorilla/mux-http路由库使用详解

    golang常用库:gorilla/mux-http路由库使用 golang常用库:配置文件解析库-viper使用 golang常用库:操作数据库的orm框架-gorm基本使用 一:golang自带路由介绍 golang自带路由库 http.ServerMux ,实际上是一个 map[string]Handler,是请求的url路径和该url路径对于的一个处理函数的映射关系.这个实现比较简单,有一些缺点: 不支持参数设定,例如/user/:uid 这种泛型类型匹配无法很友好的支持REST模式,无

  • vue demi支持sfc方式的vue2vue3通用库开发详解

    目录 背景 技术要点 vue-demi sfc compiler 实现方式 vue2.6 + vue3 + vite + vue-demi package.json vite.config.ts main.ts postinstall vue2.7 + vue3 + vite + vue-demi + yarn workspaces 目前没找到vue3为主包的开发方式 注意点 1.@vue/composition-api重复引用问题 2.由于要兼容vue2,vue3的 setup sfc语法糖不

  • Python重试库 Tenacity详解(推荐)

    目录 1 Tenacity描述 2 如果发生异常就重试 3 设置停止重试的条件 设置重试的最大次数 还可以设置stop 时间 停止重试条件 进行组合 4 设置重试的间隔 5 重试触发的条件 针对具体的异常进行重试 针对函数的返回结果进行重试 6 定义重试失败回调函数 7 错误处理 Basic usage Combination 1 Tenacity描述 今天 给大家介绍一个Python 重试库,Tenacity 这个库 是我 这些年 使用的一个非常好的库,几乎满足了我所有的重试需求,非常棒的一个

  • Golang中结构体映射mapstructure库深入详解

    目录 mapstructure库 字段标签 内嵌结构 未映射字段 Metadata 弱类型输入 逆向转换 解码器 示例 在数据传递时,需要先编解码:常用的方式是JSON编解码(参见<golang之JSON处理>).但有时却需要读取部分字段后,才能知道具体类型,此时就可借助mapstructure库了. mapstructure库 mapstructure可方便地实现map[string]interface{}与struct间的转换:使用前,需要先导入库: go get github.com/m

  • JS图片懒加载库VueLazyLoad详解

    目录 背景 说明 实现原理 1. placeholder 的实现很细致和灵活 2. 添加图片缓存 3. 事件监听使用节流 4. 监听事件不止滚动事件 5. 事件列队的方式来处理懒加载 6. 支持 data-srcset 7. 自定义控制可视区的判定范围 待完善 1. 没有解决布局抖动 2. 跳过已经加载图片的判断方式 3. 局部懒加载 4. 性能不是很好 5. observer 模式配置简单 6. SEO 不友好 总结 背景 上篇<图片懒加载原理方案详解>中详细解析了图片懒加载的原理和方案.主

  • Android Studio 生成自定义jar包的步骤详解

    想要将一个项目导出为jar包,供其它项目使用,在eclipse中可以直接导出该项目为jar包,而 在AS中可以通过修改gradle才处理. 接下来就介绍下具体的步骤: 1.新建一个项目,项目名随意,eg:MakeJarApplication,在项目中新建一个module类型为android-library ,命名为testLibrary.如图: 项目结构图 2.让app依赖这个库,在app下的build.gradle文件中添加compile project(':testlibrary') dep

  • 对pyqt5之menu和action的使用详解

    如下所示: exitAct = QAction(QIcon('exit.png'), '&Exit', self) exitAct.setShortcut('Ctrl+Q') exitAct.setStatusTip('Exit application') QAction is an abstraction for actionsperformed with a menubar, toolbar, or with a custom keyboard shortcut. QAction 模块 :菜

  • Python中logging日志库实例详解

    logging的简单使用 用作记录日志,默认分为六种日志级别(括号为级别对应的数值) NOTSET(0) DEBUG(10) INFO(20) WARNING(30) ERROR(40) CRITICAL(50) special 在自定义日志级别时注意不要和默认的日志级别数值相同 logging 执行时输出大于等于设置的日志级别的日志信息,如设置日志级别是 INFO,则 INFO.WARNING.ERROR.CRITICAL 级别的日志都会输出. |2logging常见对象 Logger:日志,

  • vite2.0+vue3移动端项目实战详解

    一.涉及技术点 vite版本 vue3 ts 集成路由 集成vuex 集成axios 配置Vant3 移动端适配 请求代理 二.步骤 vite+ts+vue3只需要一行命令 npm init @vitejs/app my-vue-app --template vue-ts 配置路由 npm install vue-router@4 --save 在src下新建router目录,新建index.ts文件 import { createRouter, createWebHashHistory, Ro

随机推荐