Cómo agregar medalla de “build” a tu módulo NPM

Nicolás Ignacio Gómez Espejo
4 min readNov 3, 2017

--

Este tutorial es la segunda parte de una serie de tutoriales que explican cómo crear un paquete NPM, con medallas y actualizaciones automáticas.

En el post anterior vimos cómo crear y subir un módulo NPM, ahora nos toca ver cómo agregarle las medallas de build 🏅

https://github.com/muZk/transantiago-api-client

Medalla de build 🏅

Esta medalla indica que los tests de tu código están pasando. Es un pequeño indicador de la calidad del código… aunque esto es debatible (por ejemplo, puedes tener un build passing sin tener tests).

Para agregar la medalla de “build” utilizaremos https://travis-ci.org/.

Paso 1: Crear cuenta en TravisCI

Crea una cuenta en TravisCI iniciando sesión con GitHub.

Una vez iniciaste sesión, verás tus repositorios y podrás agregar la integración.

Paso 2: Agregar TravisCI a tu repositorio

En la pantalla principal, verás lo siguiente:

3 simples pasos

Y abajo aparecerá un listado con tus repositorios:

Busca el repositorio que creaste y dale “ON”

Woo!

Paso 3: Agregas configuración de travis a tu repositorio

Ahora tenemos que agregar el archivo .travis.yml a nuestro repositorio

Y subir los cambios a Github.

Eso es todo!

De ahora en adelante, cada vez que subas código a Github, Travis revisará que todo esté bien.

En el caso de los últimos cambios, en tu cuenta de travis verás que tu código se está procesando:

¿Qué pasará?

Y luego de un momento…

:(

Falla! 😫 Y por culpa de los inexistentes tests:

> echo “Error: no test specified” && exit 1Error: no test specified
npm ERR! Test failed. See above for more details.

Ya que no los implementamos y en el package.json aparece claramente lo siguiente:

“scripts”: {“test”: “echo \”Error: no test specified\” && exit 1"}

Paso 4: Agregar tests

Para solucionar el problema, agregamos un archivo test.js donde tendremos un test muy simple:

Y modificaremos el package.json para que diga

"scripts": {  "test": "node test.js"},

Si ejecutas localmente npm test.js no debería haber problemas. Sube el código y espera el build (aquí puedes ver mi commit).

Todo funciona ahora

Success!! ✅

… pero todavía no hay una medalla en el repositorio.

Paso 5: Agregar medalla al repositorio

Anda al repositorio en Travis, y haz click sobre la medalla, se abrirá el siguiente modal:

Selecciona la opción “Markdown”, la cual debemos copiar y pegar en el README.md:

# PinericosasJust a "Hello World" library :)---[![Build Status](https://travis-ci.org/muZk/pinericosas.svg?branch=master)](https://travis-ci.org/muZk/pinericosas)## Installationnpm install pinericosas --save## Usage```javascriptconst pinericosas = require('pinericosas');const quote = pinericosas.randomQuote();```

Aquí puedes ver el commit para agregar la medalla.

Y listo, ahora tenemos la medalla para nuestros build 😄

TLDR;

  • Crear cuenta en Travis y habilitar tu repositorio.
  • Agregar archivo .travis.yml en tu repositorio.
  • Los siguientes push que hagas automáticamente serán verificados por travis 👐
  • Actualizar el README.md con el código del badge que te da travis (aquí puedes ver el código en el caso de ejemplo).

Palabras finales

Ahora sabes cómo agregarle una medalla de build a tu proyecto ❤

En el siguiente tutorial veremos cómo agregar la medalla de Dependencies 😃

--

--