越寫悅快樂之Vue項目如何使用GitHub Actions進(jìn)行自動發(fā)布

GitHub Actions市場 - 圖片來自簡書App

今天的越寫悅快樂之系列文章為大家?guī)鞻ue項目如何使用GitHub Actions進(jìn)行自動發(fā)布缎玫。眾所周知岂昭,GitHub已經(jīng)成為全世界碼農(nóng)進(jìn)行學(xué)習(xí)的朝圣之地,眾多的開源項目在GitHub上進(jìn)行分享和分發(fā)赶撰,讓我們一起來探索GitHub的奧秘吧。

GitHub Actions是什么(What)

GitHub Actions 是 GitHub 的持續(xù)集成服務(wù)炕舵,于2018年10月推出。

大家知道跟畅,持續(xù)集成由很多操作組成幕侠,比如抓取代碼、運行測試碍彭、登錄遠(yuǎn)程服務(wù)器,發(fā)布到第三方服務(wù)等等悼潭。GitHub 把這些操作就稱為 actions庇忌。

很多操作在不同項目里面是類似的,完全可以共享舰褪。GitHub 注意到了這一點皆疹,想出了一個很妙的點子,允許開發(fā)者把每個操作寫成獨立的腳本文件占拍,存放到代碼倉庫略就,使得其他開發(fā)者可以引用捎迫。

如果你需要某個 action,不必自己寫復(fù)雜的腳本表牢,直接引用他人寫好的 action 即可窄绒,整個持續(xù)集成過程,就變成了一個 actions 的組合崔兴。這就是 GitHub Actions 最特別的地方彰导。

GitHub 做了一個官方市場,可以搜索到他人提交的 actions敲茄。另外位谋,還有一個 awesome actions 的倉庫,也可以找到不少 action堰燎。

GitHub Actions的應(yīng)用場景(Where)

  • GitHub上的項目都可以使用

GitHub Actions的基本概念(What)

  • workflow (工作流程):持續(xù)集成一次運行的過程掏父,就是一個 workflow。

  • job (任務(wù)):一個 workflow 由一個或多個 jobs 構(gòu)成秆剪,含義是一次持續(xù)集成的運行赊淑,可以完成多個任務(wù)。

  • step(步驟):每個 job 由多個 step 構(gòu)成鸟款,一步步完成膏燃。

  • action (動作):每個 step 可以依次執(zhí)行一個或多個命令(action)。

workflow 文件

GitHub Actions 的配置文件叫做 workflow 文件何什,存放在代碼倉庫的.github/workflows目錄组哩。

workflow 文件采用 YAML 格式,文件名可以任意取处渣,但是后綴名統(tǒng)一為.yml伶贰,比如foo.yml。一個庫可以有多個 workflow 文件罐栈。GitHub 只要發(fā)現(xiàn).github/workflows目錄里面有.yml文件黍衙,就會自動運行該文件。

workflow 文件的配置字段非常多荠诬,詳見官方文檔琅翻。下面是一些基本字段。

(1)name

name字段是 workflow 的名稱柑贞。如果省略該字段方椎,默認(rèn)為當(dāng)前 workflow 的文件名。

name: GitHub Actions Demo

(2)on

on字段指定觸發(fā) workflow 的條件钧嘶,通常是某些事件棠众。

on: push

上面代碼指定,push事件觸發(fā) workflow有决。

on字段也可以是事件的數(shù)組闸拿。

on: [push, pull_request]

上面代碼指定空盼,push事件或pull_request事件都可以觸發(fā) workflow。

完整的事件列表新荤,請查看官方文檔揽趾。除了代碼庫事件,GitHub Actions 也支持外部事件觸發(fā)迟隅,或者定時運行但骨。

(3)on.<push|pull_request>.<tags|branches>

指定觸發(fā)事件時,可以限定分支或標(biāo)簽智袭。

on:
 push:
   branches:    
     - master

上面代碼指定奔缠,只有master分支發(fā)生push事件時,才會觸發(fā) workflow吼野。

(4)jobs.<job_id>.name

workflow 文件的主體是jobs字段校哎,表示要執(zhí)行的一項或多項任務(wù)。

jobs字段里面瞳步,需要寫出每一項任務(wù)的job_id闷哆,具體名稱自定義。job_id里面的name字段是任務(wù)的說明单起。

jobs:
  my_first_job:
    name: My first job
  my_second_job:
    name: My second job

上面代碼的jobs字段包含兩項任務(wù)抱怔,job_id分別是my_first_jobmy_second_job

(5)jobs.<job_id>.needs

needs字段指定當(dāng)前任務(wù)的依賴關(guān)系嘀倒,即運行順序屈留。

jobs:
  job1:
  job2:
    needs: job1
  job3:
    needs: [job1, job2]

上面代碼中,job1必須先于job2完成测蘑,而job3等待job1job2的完成才能運行灌危。因此,這個 workflow 的運行順序依次為:job1碳胳、job2勇蝙、job3

(6)jobs.<job_id>.runs-on

runs-on字段指定運行所需要的虛擬機(jī)環(huán)境挨约。它是必填字段味混。目前可用的虛擬機(jī)如下。

  • ubuntu-latest诫惭,ubuntu-18.04ubuntu-16.04
  • windows-latest惜傲,windows-2019windows-2016
  • macOS-latestmacOS-10.14

下面代碼指定虛擬機(jī)環(huán)境為ubuntu-18.04

runs-on: ubuntu-18.04

(7)jobs.<job_id>.steps

steps字段指定每個 Job 的運行步驟贝攒,可以包含一個或多個步驟。每個步驟都可以指定以下三個字段时甚。

  • jobs.<job_id>.steps.name:步驟名稱隘弊。
  • jobs.<job_id>.steps.run:該步驟運行的命令或者 action哈踱。
  • jobs.<job_id>.steps.env:該步驟所需的環(huán)境變量。

下面是一個完整的 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.

上面代碼中开镣,steps字段只包括一個步驟。該步驟先注入四個環(huán)境變量咽扇,然后執(zhí)行一條 Bash 命令邪财。

GitHub Actions的使用(How)

以我的Vue項目為例來說明GitHub Actions的基本使用。

  1. 我們在項目的頂部欄看到actions的一項质欲;
Actions位置 - 圖片來自簡書App
  1. 創(chuàng)建workflow文件树埠;

我們在項目倉庫的目錄下創(chuàng)建文件,存放的位置在.github/workflows/nodejs.yml嘶伟。

name: nodejs
on:
  push:
    branches:
      - master
jobs:
  build-and-deploy:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v2
    - uses: actions/setup-node@v2
      with:
        node-version: '12'
    - run: npm install
    - run: npm run-script build
    - name: Deploy to GitHub Pages
      uses: JamesIves/github-pages-deploy-action@3.7.1
      with:
        ACCESS_TOKEN: ${{ secrets.ACCESS_TOKEN }}
        BRANCH: gh-pages
        FOLDER: dist
  1. 保存文件并推送到GitHub怎憋;

  2. 等待workflow運行結(jié)束,訪問GitHub Pages九昧,會看到結(jié)果绊袋。

運行結(jié)果 - 圖片來自簡書App

參考(Where)

個人收獲及總結(jié)(With)

今天的文章為大家介紹了如何利用GitHub Actions為自己的項目創(chuàng)建CI服務(wù),可以讓我們隨時構(gòu)建我們的項目铸鹰,把項目的運行環(huán)境癌别、測試和發(fā)布一體化,也能節(jié)省我們的時間蹋笼,當(dāng)然我們也可以使用Docker來創(chuàng)建測試鏡像展姐,測試運行我們的項目,讓我們一起持續(xù)提升我們的技術(shù)姓建,并做更有價值的事情诞仓。若是我的文章對你有所啟發(fā),那將是我莫大的榮幸速兔。希望和您一起精進(jìn)墅拭,成為更好的自己。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末涣狗,一起剝皮案震驚了整個濱河市谍婉,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌镀钓,老刑警劉巖穗熬,帶你破解...
    沈念sama閱讀 218,122評論 6 505
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異丁溅,居然都是意外死亡唤蔗,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,070評論 3 395
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來妓柜,“玉大人箱季,你說我怎么就攤上這事」髌” “怎么了藏雏?”我有些...
    開封第一講書人閱讀 164,491評論 0 354
  • 文/不壞的土叔 我叫張陵,是天一觀的道長作煌。 經(jīng)常有香客問我掘殴,道長,這世上最難降的妖魔是什么粟誓? 我笑而不...
    開封第一講書人閱讀 58,636評論 1 293
  • 正文 為了忘掉前任奏寨,我火速辦了婚禮,結(jié)果婚禮上努酸,老公的妹妹穿的比我還像新娘服爷。我一直安慰自己,他們只是感情好获诈,可當(dāng)我...
    茶點故事閱讀 67,676評論 6 392
  • 文/花漫 我一把揭開白布仍源。 她就那樣靜靜地躺著,像睡著了一般舔涎。 火紅的嫁衣襯著肌膚如雪笼踩。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 51,541評論 1 305
  • 那天亡嫌,我揣著相機(jī)與錄音嚎于,去河邊找鬼。 笑死挟冠,一個胖子當(dāng)著我的面吹牛于购,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播知染,決...
    沈念sama閱讀 40,292評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼肋僧,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了控淡?” 一聲冷哼從身側(cè)響起嫌吠,我...
    開封第一講書人閱讀 39,211評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎掺炭,沒想到半個月后辫诅,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,655評論 1 314
  • 正文 獨居荒郊野嶺守林人離奇死亡涧狮,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,846評論 3 336
  • 正文 我和宋清朗相戀三年炕矮,在試婚紗的時候發(fā)現(xiàn)自己被綠了么夫。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 39,965評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡肤视,死狀恐怖魏割,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情钢颂,我是刑警寧澤,帶...
    沈念sama閱讀 35,684評論 5 347
  • 正文 年R本政府宣布拜银,位于F島的核電站殊鞭,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏尼桶。R本人自食惡果不足惜操灿,卻給世界環(huán)境...
    茶點故事閱讀 41,295評論 3 329
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望泵督。 院中可真熱鬧,春花似錦、人聲如沸唯沮。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,894評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽秩冈。三九已至本缠,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間入问,已是汗流浹背丹锹。 一陣腳步聲響...
    開封第一講書人閱讀 33,012評論 1 269
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機(jī)就差點兒被人妖公主榨干…… 1. 我叫王不留芬失,地道東北人楣黍。 一個月前我還...
    沈念sama閱讀 48,126評論 3 370
  • 正文 我出身青樓,卻偏偏與公主長得像棱烂,于是被迫代替她去往敵國和親租漂。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 44,914評論 2 355

推薦閱讀更多精彩內(nèi)容