Criando uma Action para compilar uma aplicação feita no ElectronJs utilizando GitHub

Olá Gente!

GitHub é magnifico, podemos configurar para que sempre que você fizer um push de alguma mudança, já inicie a compilação de sua aplicação.

Se você utiliza windows, não consegue compilar aplicativo do ElectronJs para o MAC, mas via GitHub é possível já que podemos criar uma Action para compilar utilizando o MAC.

Primeiramente crie um arquivo dentro da pasta “.github/workflows/” de seu repositório.

No meu caso, utilizo nome “release.yml”.

Neste arquivo precisamos especificar quais as ações serão feitas, quando serão feitas e qualquer outra especificação.

Antes de tudo precisamos definir o nome da ação:

name: Release

Agora iremos configurar para que esta ação seja executada apenas quando fizermos um push com uma tag que comece com “v” (Por exemplo: “v1.0.8”).

Desta forma, podemos indicar que apenas push que mudem a versão do repositório devem executar a ação.

Então configuramos o filtro:

on: 
  push: 
    tags: 
      - 'v*'

Agora iremos começar a configurar os “jobs”.

Uma ação pode ter vários jobs diferentes, neste caso, iremos configurar dois jobs, para para compilar para windows e um para compilar para mac.

Os Jobs ficam dentro do elemento:

jobs:

Vamos começar a compilação para MAC:

publish_on_mac: 
    permissions: write-all 
    runs-on: macos-latest 
    steps: 
    - uses: actions/checkout@v2 
    - uses: actions/setup-node@master 
      with: 
        node-version: 14 
    - name: install dependencies 
      run: npm install 
    - name: build 
      run: npm run build 
    - name: publish 
      env: 
        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 
      run: npm run publish

E agora para Windows:

publish_on_win: 
    permissions: write-all 
    runs-on: windows-latest 
    steps: 
    - uses: actions/checkout@v2        
    - uses: actions/setup-node@master 
      with: 
        node-version: 14 
    - name: install dependencies 
      run: npm install 
    - name: build 
      run: npm run build 
    - name: publish 
      env: 
        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 
      run: npm run publish

No final, teremos um arquivo “release.yml” similar ao arquivo abaixo:

name: Release 
 
on: 
  push: 
    tags: 
      - 'v*' 
    
jobs: 
 
  publish_on_mac: 
    permissions: write-all 
    runs-on: macos-latest 
    steps: 
    - uses: actions/checkout@v2 
    - uses: actions/setup-node@master 
      with: 
        node-version: 14 
    - name: install dependencies 
      run: npm install 
    - name: build 
      run: npm run build 
    - name: publish 
      env: 
        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 
      run: npm run publish 
    
  publish_on_win: 
    permissions: write-all 
    runs-on: windows-latest 
    steps: 
    - uses: actions/checkout@v2        
    - uses: actions/setup-node@master 
      with: 
        node-version: 14 
    - name: install dependencies 
      run: npm install 
    - name: build 
      run: npm run build 
    - name: publish 
      env: 
        GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 
      run: npm run publish

Vamos entender o que esta sendo feito:

• Primeiro configuramos para que a ação possa escrever no repositório, isto ira permitir a criação de um “release”, isto é feito em “permissions: write-all”
• Através do “runs-on” configuramos o sistema operacional que será utilizado na compilação

Depois disto começamos as etapas da compilação através do elemento “steps”:

• Carregamos “actions/checkout@v2” que é necessário para toda ação
• Carregamos o Nodejs na versão 14 através de “actions/setup-node@master”

Agora começa a parte legal:

• Iremos executar o comando “npm install” para instalar as dependências de nosso projeto
• Executamos o comando “npm run build” que executar o build de nossa aplicação (Isto caso você tenha esta função no “package.json”)
• Executamos o comando “npm run publish” para que o ElectronJs compile a aplicação

Observe que você precisa ter a função “publish” em seu “package.json” configurada para compilar a aplicação:

"scripts": { 
    "publish": "electron-forge publish" 
  },

Quando você fizer um Push com uma tag de versão, o Github ira começar as ações.

Depois que as ações forem completadas a action é exibida com status de completada:

E um “release” de rascunho é criado que você pode converter em um release oficial tendo a compilação para Dowload.

Finalizando este tutorial, gente! 😄

Até já! 👋