github action自动部署构建入门(2)

简介: github action自动部署构建入门(2)

3.7 with传参

firstname ,会被转化为INPUTFIRST_NAME使用

  jobs:
  my_first_job:
    steps:
      - name: My first step
        uses: actions/hello_world@master
        with:
          first_name: Mona
          middle_name: The
          last_name: Octocat   

3.8 env环境变量

  steps:
    - name: Hello world
      run: echo Hello world $FIRST_NAME $middle_name $Last_Name!
      env:
        FIRST_NAME: Mona
        middle_name: The
        Last_Name: Octocat

3.9 secrets引用

  steps:
  - name: My first action
    env:
      GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
      FIRST_NAME: Mona
      LAST_NAME: Octocat
  steps:
  - name: Hello world action
    with: # Set the secret as an input
      super_secret: ${{ secrets.SuperSecret }}
    env: # Or as an environment variable
      super_secret: ${{ secrets.SuperSecret }}

3.10 action/checkout检查

https://github.com/actions/checkout

最新版本特性:


提高性能

默认情况下只获取一个提交

脚本验证的 git 命令

身份验证令牌保留在本地 git 配置中

支持SSH

创建本地分支

检出分支时不再分离 HEAD

改进的布局

输入path总是相对于 $GITHUB_WORKSPACE

与容器操作更好地对齐,其中 $GITHUB_WORKSPACE 被映射到

回退到 REST API 下载

当 PATH 中没有 Git 2.18 或更高版本时,将使用 REST API 下载文件

使用作业容器时,使用容器的 PATH

4. 获取token

根据GitHub提供的文档生成密钥,生成好后记得复制下来,要不然再访问页面的时候密钥就不展示了。

# 生成密钥时主要需要开启的权限有
1、rope 下所有权限
2、admin:repo_hook 下所有权限
3、delete_repo 下所有权限
# 主要是关于rope的权限,尽量都开启

要使用Actions功能的仓库的Settings中的Secrets中新增一条

Name为:ACCESS_TOKEN
Value为:刚才生成好的密钥

1832b220aa754cd18c504acc7686a560.png

5. 示例

5.1 一条命令的action

下面是一个完整的 workflow 文件的范例。

name: Greeting from Mona
on: push
jobs:
  my-job:
    name: My Job
    runs-on: ubuntu-latest
    steps:
    - name: Print a greeting
      env:
        MY_VAR: Hi there! My name is
        FIRST_NAME: Mona
        MIDDLE_NAME: The
        LAST_NAME: Octocat
      run: |
        echo $MY_VAR $FIRST_NAME $MIDDLE_NAME $LAST_NAME.

示例文件运行截图:

1832b220aa754cd18c504acc7686a560.png

5.2 React 项目发布到 GitHub Pages

下面是一个实例,通过 GitHub Actions 构建一个 React 项目,并发布到 GitHub Pages。最终代码都在这个仓库里面,发布后的参考网址为ghostwritten.github.io/github-actions-demo


第一步:这个示例需要将构建成果发到 GitHub 仓库,因此需要 GitHub 密钥。按照官方文档,生成一个密钥。然后,将这个密钥储存到当前仓库的Settings/Secrets里面。

1832b220aa754cd18c504acc7686a560.png

上图是储存秘密的环境变量的地方。环境变量的名字可以随便起,这里用的是ACCESS_TOKEN。如果你不用这个名字,后面脚本里的变量名也要跟着改。

第二步:本地计算机使用create-react-app,生成一个标准的 React 应用。

$ npx create-react-app github-actions-demo
$ cd github-actions-demo


然后,打开package.json文件,加一个homepage字段,表示该应用发布后的根目录(参见官方文档)。

"homepage": "https://[username].github.io/github-actions-demo",

上面代码中,将[username]替换成你的 GitHub 用户名,参见范例。


第三步,在这个仓库的.github/workflows目录,生成一个 workflow 文件,名字可以随便取,这个示例是ci.yml。


别人的 action:JamesIves/github-pages-deploy-action

name: Build and Deploy
on:
  push:
    branches:
      - master
jobs:
  build-and-deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout 🛎️
        uses: actions/checkout@v1
      - name: Build and Deploy
        uses: JamesIves/github-pages-deploy-action@releases/v2
        env:
          ACCESS_TOKEN: ${{ secrets.ACCESS_TOKEN }} ## GitHub 密钥 ACCESS_TOKEN 是在第二步Settings的Secrets中新增时定义的Name,要保持一致
          BASE_BRANCH: master # The branch the action should deploy from.
          BRANCH: gh-pages # The branch the action should deploy to.
          FOLDER: build # The folder the action should deploy.
          BUILD_SCRIPT: npm install && npm run-script build # The build script the action should run prior to deploying.

上面这个 workflow 文件的要点如下。


整个流程在master分支发生push事件时触发。

只有一个job,运行在虚拟机环境ubuntu-latest。

第一步是获取源码,使用的 action 是actions/checkout。

第二步是构建和部署,使用的 action 是JamesIves/github-pages-deploy-action。

第二步需要四个环境变量,分别为 GitHub 密钥、发布分支、构建成果所在目录、构建脚本。其中,只有 GitHub密钥是秘密变量,需要写在双括号里面,其他三个都可以直接写在文件里。

第五步,保存上面的文件后,将整个仓库推送到 GitHub。GitHub 发现了 workflow 文件以后,就会自动运行。你可以在网站上实时查看运行日志,日志默认保存30天。

1832b220aa754cd18c504acc7686a560.png

等到 workflow 运行结束,访问 GitHub Page,即https://ghostwritten.github.io/github-actions-demo,会看到构建成果已经发上网了。如果你想知道如何利用github搭建一个博客,请参考。因为我的博客域名为smoothies.com.cn,当访问ghostwritten.github.io会自动跳转smoothies.com.cn。

1832b220aa754cd18c504acc7686a560.png

以后,每次修改后推送源码,GitHub Actions 都会自动运行,将构建产物发布到网页。


参考链接:


https://jamesiv.es/

https://github.com/JamesIves

https://github.com/JamesIves/github-pages-deploy-action

https://www.ruanyifeng.com/blog/2019/09/getting-started-with-github-actions.html


相关文章
|
17天前
|
对象存储
一个通过 GitHub Action 将 GitHub 仓库与阿里云 OSS 完全同步的脚本
一种将 GitHub 仓库完全同步到阿里云 OSS 的方法。
|
3月前
|
安全 网络安全
GitHub星标4000!清华大牛的CTF竞赛入门指南,真的太香了!
想进入网络安全行业、实现从学校到职场的跨越,参加CTF竞赛是很好的成长途径。 通俗而言,CTF是模拟“黑客”所使用的技术、工具、方法等手段发展出来的网络安全竞赛,有了手段之后需要的就是经验与黑客感(HackorFeel)。 CTF赛题涉及的领域很广,市面上也早有在知识广度上均有所覆盖的CTF书籍,但没有深入单一领域的内容,尤其是Pwn方向的。 Pwn是网络安全攻防最有魅力的部分,对于原教旨攻防人士来说,Pwm才是原汁原味的技术体现。二进制Pwn一直是CTF比赛的热点和难点。
|
3月前
|
数据采集 数据可视化 算法
GitHub星标68K!Python数据分析入门手册带你从数据获取到可视化
Python作为一门优秀的编程语言,近年来受到很多编程爱好者的青睐。一是因为Python本身具有简捷优美、易学易用的特点;二是由于互联网的飞速发展,我们正迎来大数据的时代,而Python 无论是在数据的采集与处理方面,还是在数据分析与可视化方面都有独特的优势。我们可以利用 Python 便捷地开展与数据相关的项目,以很低的学习成本快速完成项目的研究。
|
3月前
|
数据采集 数据可视化 算法
GitHub星标68K!Python数据分析入门手册带你从数据获取到可视化
Python作为一门优秀的编程语言,近年来受到很多编程爱好者的青睐。一是因为Python本身具有简捷优美、易学易用的特点;二是由于互联网的飞速发展,我们正迎来大数据的时代,而Python 无论是在数据的采集与处理方面,还是在数据分析与可视化方面都有独特的优势。我们可以利用 Python 便捷地开展与数据相关的项目,以很低的学习成本快速完成项目的研究。 今天给小伙伴们分享的这份Python数据分析入门手册本着实用性的目的,着眼于整个数据分析的流程,介绍了从数据采集到可视化的大致流程。
|
3月前
|
程序员 开发工具 git
Github入门10问,收藏~
Github入门10问,收藏~
|
3月前
|
Linux C++ Docker
【Azure Developer】在Github Action中使用Azure/functions-container-action@v1配置Function App并成功部署Function Image
【Azure Developer】在Github Action中使用Azure/functions-container-action@v1配置Function App并成功部署Function Image
|
3月前
|
数据安全/隐私保护
【Azure Developer】Github Action使用Azure/login@v1插件登录遇见错误的替代方案
【Azure Developer】Github Action使用Azure/login@v1插件登录遇见错误的替代方案
|
3月前
|
存储
【Azure Developer】Github Action部署资源(ARM模板)到Azure中国区时,遇见登录问题的解决办法
【Azure Developer】Github Action部署资源(ARM模板)到Azure中国区时,遇见登录问题的解决办法
|
3月前
|
Java 网络安全 开发工具
新手入门Java。如何下载Eclipse、写出最基本的“Hello word”以及如何连接github并且上传项目。
新手入门Java。如何下载Eclipse、写出最基本的“Hello word”以及如何连接github并且上传项目。
55 0
|
5月前
|
程序员 Python
GitHub爆赞!最适合新手入门的教程——笨方法学Python 3
“Python 是一门既容易上手又强大的编程语言。”这句话本身并无大碍,但需要注意的是,正因为它既好学又好用,所以很多 Python 程序员只用到了其强大功能的一小部分。 今天给小伙伴们分享的这份手册以习题的方式引导读者一步一步学习编程,从简单的打印一直讲到完整项目的实现。