DEV Community

Kimberly Myers
Kimberly Myers

Posted on

Create Multiple GitHub Actions in a Single Repository

You can create and package multiple GitHub Actions in a single repository that are written using TypeScript/JavaScript, allowing each action to run separately. Below is how to accomplish this using vercel/ncc, which allows compiling modules into a single file with its dependencies eliminating the need to include the node_modules folder in your repository:

Create and Configure Actions:

  • Create a separate folder for each action and configure the action.yml file within each folder

πŸ“ test-action
-❕ action.yml
πŸ“ test-action-2
-❕ action.yml

Add Source Code:

  • Place your source code for each action in the src folder

πŸ“ src
-πŸ“„ test-action.ts
-πŸ“„ test-action-2.ts

Create Distribution Folder:

  • Create a folder named dist to store the packaged source code
    πŸ“ dist

  • Create separate folder for each action under dist folder
    πŸ“ dist
    -πŸ“ test-action
    -πŸ“ test-action-2

Update package.json:

  • Add a separate script to "scripts" in the package.json file for each action that calls npx ncc build command passing the TypeScript source code file and the output distribution folder for the action. Each script will be used to package your TypeScript source file as JavaScript in a generated file called index.js.
"scripts": {
  "testAction": "npx ncc build src/test-action.ts -o dist/test-action --source-map --license licenses.txt",
  "testAction2": "npx ncc build src/test-action-2.ts -o dist/test-action-2 --source-map --license licenses.txt"
}
Enter fullscreen mode Exit fullscreen mode
  • Add a script to bundle all packages and copy the generated JavaScript source to the distribution folder
"scripts": {
  "bundle": "npm run format:write && npm run testAction && npm run testAction2 && copy src/*.js dist"
}
Enter fullscreen mode Exit fullscreen mode

Run the bundle script:

npm run bundle
Enter fullscreen mode Exit fullscreen mode

Update the action.yml to call package source in distribution folder for each action:

runs:
  using: node20
  main: '../dist/test-action/index.js'
Enter fullscreen mode Exit fullscreen mode
runs:
  using: node20
  main: '../dist/test-action-2/index.js'
Enter fullscreen mode Exit fullscreen mode

Create a GitHub workflow to test

on:
  workflow_dispatch:

jobs:
  action_test_job:
    runs-on: ubuntu-latest

    name: Test multiple actions
    steps:
      - name: Checkout
        uses: actions/checkout@v4

- name: Test Action
        id: testaction
        uses: ./test-action

- name: Test Action2
        id: testaction2
        uses: ./test-action2
Enter fullscreen mode Exit fullscreen mode

References

Top comments (0)