在本系列文章中，我們已經看到 Monday Studio 開發了一些工具來自動化他們的工作流程。在之前的文章中，我們告訴您可以透過許多持續整合服務來運行這些工具。今天，我們將向您展示如何在 GitHub Actions 上遠端自動執行這些操作。
使用 GitHub Actions 執行您的設計工作流程自動化，代表您不需要在電腦上安裝任何東西。當您將更新傳送到共用儲存庫時，所有程式碼都會在雲端自動執行。如果您需要調整工具，可以使用 GitHub Codespaces 或其他完全在瀏覽器上運行的線上程式碼編輯器（例如 Visual Studio Code）來完成。
使用 GitHub Actions 意味著新團隊成員可以更快上手、降低總持有成本 (TCO)、減少摩擦並減少開發者工具的版本相容性問題。所有程式碼都從同一個集中式的資料來源運行。此外，它還可以快速輕鬆地與現有的工作流程和工具整合。
使用 GitHub Actions 執行您的設計工作流程自動化，代表您不必擔心開發環境的依賴關係和維護。此外，您還可以在任何地方編輯和執行該程式碼，實現真正的跨平台工作流程。
需求
您只需要一台具有瀏覽器的裝置即可跟著本文操作。事實上，為了讓您了解我們所說的「跨平台自動化執行方法」是什麼意思，您甚至可以使用智慧型手機完成以下所有步驟。
我們將建構的內容
今天我們不會建構任何東西。我們將重新檢視本系列中所有已建構工具的儲存庫，並查看它們的 .github/workflows 資料夾。
對於所有這些專案，您都會看到一個大致如下所示的 YAML 檔案
name: Name of the action we're running
on:
# Instructions about *when* to run this automation
...
jobs:
# Instructions about *what* to run in this automation
...
我們已將這些儲存庫設定為 GitHub 上的公開範本。您可以點擊每個儲存庫首頁上的「使用此範本」按鈕，以建立您自己的可編輯專案副本。
何時執行我們的 Actions
一般來說，我們希望在程式碼變更時執行自動化操作。我們可以使用以下程式碼指定這一點，該程式碼告訴 GitHub Actions 在我們將程式碼推送至 main 分支或開啟以此分支為目標的拉取請求時執行此操作
on:
push:
branches: [main]
pull_request:
branches: [main]
有時您會希望將動作的範圍限制在特定檔案。在我們的Sketch 轉 JSON 自動化中有一個這樣的例子。該動作只會在我們修改定義程式庫顏色的 JSON 檔案時才會運行。
on:
push:
paths:
- colors.json
- .github/workflows/**.yml
branches: [main]
自動運行 Actions 令人非常滿意。但有時您需要手動運行 Action，尤其是在除錯時。要執行此操作，您可以在 on: 區段中新增一個 workflow_dispatch: 項目。
on:
push:
...
pull_request:
...
workflow_dispatch:
這將在 GitHub 網站上啟用一個按鈕，您可以在需要運行 action 時按下它。
該按鈕甚至可以在 GitHub 的行動版上使用，因此您可以在公園散步時運行您的自動化程序！
在 Action 中運行什麼
一旦我們定義了 *何時* 想要運行 Action，就該指定 Action 將要執行的 *內容* 了。對於本系列中的任何專案，答案始終相同 — 我們希望 GitHub Actions 運行 yarn start 來運行專案中的程式碼。
在此之前，我們需要告訴運行 action 的伺服器一些關於我們理想工作環境的資訊（我們想要使用的 node 版本等）。如果您查看我們任何專案中 .github/workflows 的程式碼，您會看到類似以下的內容：
jobs:
build:
runs-on: ubuntu-latest
steps:
...
- name: Install node
uses: actions/setup-node@v2
with:
node-version: 14.16
- name: Install dependencies
run: yarn install
- name: Update Sketch Library
run: yarn start
...
簡而言之，這告訴 GitHub Actions 我們想要使用 Linux 伺服器（在本例中為 Ubuntu），安裝 14.16 版的 node 執行環境，並在我們的專案上運行 yarn install。
閉環
現在我們知道如何讓 GitHub Actions 運行我們專案中的程式碼，我們可能想要收集我們工作的成果並將輸出儲存在某個地方。我們可以用不同的方式做到這一點，但其中兩種特別有用 — 將變更提交回我們的儲存庫，以及將資源儲存在 GitHub 上 Actions 頁面的 Artifacts 中。
提交您的變更
如果我們專案的輸出是我們想要儲存在儲存庫中的內容，以及我們的其他檔案，那麼最好的方法是提交運行 Action 的結果。這就像在我們的 workflow 檔案中新增以下內容作為最後一個步驟一樣簡單：
- name: Push changes in Sketch Library
uses: actions-x/commit@v2
with:
email: developer@sketch.com
name: Sketch Developer
files: color-library.sketch
運行 Action 會將 files: 區段中列出的任何檔案提交到您的儲存庫。您可以修改提交訊息，甚至將變更推送到不同的儲存庫。查看actions-x/commit 的文件以獲取更多資訊。
儲存 Action Artifacts
如果產生的檔案太大，或者您不希望它們污染專案的歷史記錄，您可以將它們儲存為 GitHub Actions 上的 Artifacts。任何訪問該頁面的人都可以下載這些 Artifacts。要執行此操作，您的 Action 的最後一個步驟應如下所示：
- uses: actions/upload-artifact@v2
with:
name: Material Design Icons - Sketch Library
path: material-design-icons.sketch
現在，每當 Action 運行時，在 path: 區段中指定的檔案都可以在 GitHub 網站上 Action 的 Artifacts 區段中找到。
查看actions/upload-artifact 的文件以獲取更多資訊。
結語
在本文中，我們介紹了如何使用 GitHub Actions 從雲端運行您的 Sketch 自動化。我們希望您喜歡這個系列，並且您可以使用這些知識想出新的方法來讓您的設計流程更好、更輕鬆，並減少摩擦。
一如既往，如果您做出了很棒的東西，請告訴我們。我們很樂意收到您的來信！
