Frecuentemente publicamos actualizaciones de nuestra documentación. Es posible que la traducción de esta página esté en curso. Para conocer la información más actual, visita la documentación en inglés. Si existe un problema con las traducciones en esta página, por favor infórmanos.

Crear una acción de JavaScript

En esta guía, aprenderás como desarrollar una acción de JavaScript usando el kit de herramientas de acciones.

Acciones de GitHub is available with GitHub gratis, GitHub Pro, Equipo de GitHub, and Nube de GitHub Enterprise. Acciones de GitHub is unavailable for per-repository plans, which are legacy billing plans. For more information, see "GitHub's products."

En este articulo:

Introducción

La acción que crees imprimirá "Hello World" en los registros o "Hello [who-to-greet]" si brindas un nombre personalizado. Para obtener más información, consulta el repositorio actions/toolkit.

Una vez que completes este proyecto, deberías comprender cómo crear tu propia acción de JavaScript y probarla en un flujo de trabajo.

Prerrequisitos

Antes de comenzar, necesitarás descargar Node.js y crear un repositorio GitHub.

  1. Descarga e instala Node.js 12.x, que incluye npm.

    https://nodejs.org/en/download/current/

  2. Crea un repositorio nuevo en GitHub. Puedes elegir cualquier nombre de repositorio o usar "hello-world-javascript-action" como este ejemplo. Puedes agregar estos archivos después de que tu proyecto se haya subido a GitHub. Para obtener más información, consulta "Crear un repositorio nuevo".

  3. Clona tu repositorio en tu computadora. Para obtener más información, consulta "Clonar un repositorio".

  4. Desde tu terminal, cambia los directorios en tu repositorio nuevo.

    cd hello-world-javascript-action
  5. Desde tu terminal, inicializa el directorio con un archivo package.json.

    npm init -y

Crear un archivo de metadatos de acción

Crea un nuevo archivo action.yml en el directorio hello-world-javascript-action con el siguiente código de ejemplo.

action.yml

name: 'Hello World'
description: 'Greet someone and record the time'
inputs:
  who-to-greet:  # id of input
    description: 'Who to greet'
    required: true
    default: 'World'
outputs:
  time: # id of output
    description: 'The time we greeted you'
runs:
  using: 'node12'
  main: 'index.js'

Este archivo define la entrada who-to-greet y la salida time. También informa al ejecutador de la acción cómo empezar a ejecutar esta acción de JavaScript.

Agregar paquetes del kit de herramientas de acciones

El kit de herramientas de acciones es una recopilación de los paquetes Node.js que te permiten desarrollar rápidamente acciones de JavaScript con más consistencia.

El paquete @actions/core del kit de herramientas brinda una interfaz a los comandos de registro, variables de entrada y salida, estados de salida y mensajes de depuración.

El conjunto de herramientas también ofrece un paquete @actions/github que devuelve un cliente autenticado Octokit REST y acceso a los contextos de Acciones de GitHub.

El kit de herramientas ofrece más de un paquete core y github. Para obtener más información, consulta el repositorio actions/toolkit.

En tu terminal, instala los paquetes core and github del kit de herramientas de acciones.

npm install @actions/core
npm install @actions/github

Ahora deberías ver un directorio node_modules con los módulos que acabas de instalar y un archivo package-lock.json con las dependencias del módulo instalado y las versiones de cada módulo instalado.

Escribir el código de la acción

Esta acción usa el kit de herramientas para obtener la variable de entrada who-to-greet requerida en el archivo de metadatos de la acción e imprime "Hello [who-to-greet]" en un mensaje de depuración del registro. A continuación, el script obtiene la hora actual y la establece como una variable de salida que pueden usar las acciones que se ejecutan posteriormente en unt rabajo.

Las Acciones de GitHub proporcionan información de contexto sobre el evento de webhooks, las referencias de Git, el flujo de trabajo, la acción y la persona que activó el flujo de trabajo. Para acceder a la información de contexto, puedes usar el paquete github. La acción que escribirás imprimirá el evento de webhook que carga el registro.

Agrega un archivo nuevo denominado index.js, con el siguiente código.

index.js

const core = require('@actions/core');
const github = require('@actions/github');

try {
  // `who-to-greet` input defined in action metadata file
  const nameToGreet = core.getInput('who-to-greet');
  console.log(`Hello ${nameToGreet}!`);
  const time = (new Date()).toTimeString();
  core.setOutput("time", time);
  // Get the JSON webhook payload for the event that triggered the workflow
  const payload = JSON.stringify(github.context.payload, undefined, 2)
  console.log(`The event payload: ${payload}`);
} catch (error) {
  core.setFailed(error.message);
}

Si se lanza un error en el ejemplo anterior index.js example, core.setFailed(error.message); usa el paquete del conjunto de herramientas de acciones @actions/core para registrar un mensaje y establecer un código de salida defectuoso. Para obtener más información, consulta "Setting an action's status using exit codes."

Crear un README

Puedes crear un archivo README para que las personas sepan cómo usar tu acción. Un archivo README resulta más útil cuando planificas el intercambio de tu acción públicamente, pero también es una buena manera de recordarle a tu equipo cómo usar la acción.

En tu directorio hello-world-javascript-action, crea un archivo README.md que especifique la siguiente información:

  • Una descripción detallada de lo que hace la acción.
  • Argumentos necesarios de entrada y salida.
  • Argumentos opcionales de entrada y salida.
  • Secretos que utiliza la acción.
  • Variables de entorno que utiliza la acción.
  • Un ejemplo de cómo usar tu acción en un flujo de trabajo.

README.md

# Hello world docker action

Esta acción imprime "Hello World" o "Hello" + el nombre de una persona a quien saludar en el registro.

## Entradas

### `who-to-greet`

**Obligatorio** El nombre de la persona a quién saludar. Predeterminado `"World"`.

## Outputs

### `time`

El tiempo en que lo saludamos.

## Ejemplo de uso

uses: actions/hello-world-javascript-action@v1
with:
  who-to-greet: 'Mona the Octocat'

Confirmar y subir tu acción a GitHub

GitHub descarga cada ejecución de la acción en un flujo de trabajo durante el tiempo de ejecución y la ejecuta como un paquete completo de códigos antes de que puedas usar los comandos del flujo de trabajo como run para interactuar con la máquina virtual. Eso significa que debes incluir cualquier dependencia de paquete requerida para ejecutar el código de JavaScript. Necesitarás verificar los paquetes core y github del kit de herramientas para el repositorio de tu acción.

Desde tu terminal, confirma tus archivos action.yml, index.js, node_modules, package.json, package-lock.json y README.md. Si agregaste un archivo .gitignore que enumera node_modules, deberás eliminar esa línea para confirmar el directorio node_modules.

git add action.yml index.js node_modules/* package.json package-lock.json README.md
git commit -m "My first action is ready"
git push

Como una alternativa para comprobar tu directorio node_modules, puedes usar una herramienta denominada zeit/ncc para completar tu código y los módulos en un archivo utilizado para distribución.

  1. Instala zeit/ncc al ajecutar este comando en tu terminal. npm i -g @zeit/ncc

  2. Compila tu archivo index.js. ncc build index.js

    Verás un nuevo archivo dist/index.js con tu código y los módulos compilados.

  3. Cambia la palabra clave main en tu archivo action.yml para usar el nuevo archivo dist/index.js. main: 'dist/index.js'

  4. Si ya has comprobado tu directorio node_modules, eliminínalo. rm -rf node_modules/*

  5. Desde tu terminal, confirma las actualizaciones para tu action.yml, dist/index.js y node_modules.

    git add action.yml dist/index.js node_modules/*
    git commit -m "Use zeit/ncc"
    git push

Probar tu acción en un flujo de trabajo

Ahora estás listo para probar tu acción en un flujo de trabajo. Cuando una acción esté en un repositorio privado, la acción solo puede usarse en flujos de trabajo en el mismo repositorio. Las acciones públicas pueden ser usadas por flujos de trabajo en cualquier repositorio.

Ejemplo usando una acción pública

El siguiente código de flujo de trabajo usa la acción hello world completada en el repositorio actions/hello-world-javascript-action. Copia el código de flujo de trabajo en un archivo .github/workflows/main.yml, pero reemplaza el repositorio actions/hello-world-javascript-action con el repositorio que creaste. También puedes reemplazar la entrada who-to-greet con tu nombre.

.github/workflows/main.yml

on: [push]

jobs:
  hello_world_job:
    runs-on: ubuntu-latest
    name: A job to say hello
    steps:
    - name: Hello world action step
      id: hello
      uses: actions/hello-world-docker-action@v1
      with:
        who-to-greet: 'Mona the Octocat'
    # Usa los resultados del paso `hello`
    - name: Get the output time
      run: echo "The time was ${{ steps.hello.outputs.time }}"

Ejemplo usando una acción privada

Copia el siguiente ejemplo de código de flujo de trabajo en un archivo .github/workflows/main.yml en tu repositorio de acción. También puedes reemplazar la entrada who-to-greet con tu nombre.

.github/workflows/main.yml

on: [push]

jobs:
  hello_world_job:
    runs-on: ubuntu-latest
    name: A job to say hello
    steps:
      # To use this repository's private action, you must check out the repository
      - name: Checkout
        uses: actions/checkout@v1
      - name: Hello world action step
        uses: ./ # Uses an action in the root directory
        id: hello
        with:
          who-to-greet: 'Mona the Octocat'
      # Use the output from the `hello` step
      - name: Get the output time
        run: echo "The time was ${{ steps.hello.outputs.time }}"

En tu repositorio, haz clic en la pestaña Actions (Acciones), y selecciona la última ejecución de flujo de trabajo. Deberías ver "Hello Mona the Octocat" o el nombre que usaste para la entrada who-to-greet y la marcación de hora impresa en el registro.

Una captura de pantalla del uso de tu acción en un flujo de trabajo

Pregunta a una persona

¿No puedes encontrar lo que estás buscando?

Contáctanos