Buenas prácticas para crear un paquete npm moderno con la seguridad en mente

La tecnología siempre está cambiando, y tus procesos y prácticas deben mantenerse al día. Así que, aunque npm tiene 15 años (a partir de 2025), tus prácticas para crear paquetes npm idealmente deberían ser mucho más modernas. Si crees que quizá estén un poco desactualizadas, sigue leyendo. 

En este tutorial, te guiaremos paso a paso para crear un paquete npm con buenas prácticas modernas (a partir de 2025). Primero aprenderás a crear un paquete npm para familiarizarte con el proceso de creación y publicación de paquetes en el registro de npm. Después conocerás lo que implica crear un paquete más sólido y listo para producción: configurar un framework de pruebas, un pipeline de integración y despliegue continuos, verificaciones de seguridad y administración automatizada de versiones semánticas para los lanzamientos. Al terminar este tutorial, tendrás la confianza necesaria para crear paquetes npm modernos y sostenibles. ¡Comencemos!

Requisitos previos

1. Familiaridad con Node.js, JavaScript/TypeScript, GitHub y GitHub Actions

2. Herramientas de desarrollo disponibles para ayudarte a crear un paquete npm

Ejemplo de un paquete npm sencillo

Primero, familiaricémonos con el proceso para crear y publicar un paquete npm mediante un ejemplo sencillo. Si ya lo conoces, puedes avanzar a la sección Paquete npm listo para producción, donde se abordan temas más avanzados.

Configura tu proyecto

Necesitarás un proyecto en GitHub para comenzar. Sigue estos pasos para iniciar uno. Si ya tienes uno que puedas usar, puedes ir a la siguiente sección, pero asegúrate de revisar bien el paso 5 de esta sección sobre el nombre del paquete.

• Crea un repositorio de GitHub: https://github.com/new

• Clona el repositorio localmente.
  Ejemplo: git clone https://github.com/snyk-snippets/simple-npm-package.git

• Abre la terminal y cambia al directorio de la carpeta del proyecto que clonaste.
  Ejemplo: cd simple-npm-package

• Ejecuta npm init -y para crear un archivo package.json. Nota: Si clonaste el repositorio de ejemplo, no necesitas realizar este paso.

• Actualiza la propiedad name en package.json con un nombre con ámbito.
  Ejemplo: @clarkio/simple-npm-package. Asegúrate de usar tu nombre de usuario o el de tu organización en lugar de @clarkio.

• Escribe el código del paquete (o simplemente usa el ejemplo «hello world» en index.js).

Una vez creado el proyecto, puedes continuar y crear una cuenta de npm.

Configura una cuenta de npm

Para que otras personas puedan usar tu paquete npm, necesitarás una cuenta de npm. Los siguientes pasos te guiarán para crear tu propia cuenta (si aún no tienes una), habilitar la autenticación de dos factores (2FA) para mejorar la seguridad de la cuenta y conectarla a tu equipo local.

1. Regístrate en npm en https://www.npmjs.com/signup. 

2. Para mejorar la seguridad, habilita la 2FA en tu cuenta de npm: https://docs.npmjs.com/configuring-two-factor-authentication. 

3. Inicia sesión con tu cuenta de npm desde la terminal usando el comando npm login y sigue las instrucciones que aparecen en pantalla. Por ejemplo:

1> npm login
2npm notice Log in on https://registry.npmjs.org/
3Username: clarkio
4Password:
5Email: (this IS public) <email address>
6npm notice Please use the one-time password (OTP) from your authenticator application
7Enter one-time password from our authenticator app: <OTP>
8Logged in as clarkio on https://registry.npmjs.org/.

Cómo publicar tu paquete npm

Una vez que tengas un proyecto npm y una cuenta de npm, estarás listo para publicar tu paquete en el registro público y oficial de npmjs para que otras personas puedan usarlo. Sigue estos pasos para revisar qué se publicará antes de hacerlo y, luego, ejecutar la publicación:

1. En la terminal, ejecuta npx pack --dry-run para ver el contenido que se incluirá en la versión publicada del paquete.

1> npx pack --dry-run
2npm notice Tarball Contents
3npm notice 1.1kB LICENSE
4npm notice 1.9kB README.md
5npm notice 108B index.js
6npm notice 700B package.json
7npm notice Tarball Details

Así te aseguras de no omitir ningún archivo de código fuente necesario para que el paquete funcione correctamente. También es una buena práctica comprobar que no estés exponiendo accidentalmente información confidencial, como un archivo de configuración local con credenciales de base de datos o claves de API.

2. En la terminal, ejecuta npm publish --dry-run para ver qué ocurriría al ejecutar el comando de verdad.

1> npm publish --dry-run
2npm notice
3npm notice 📦@clarkio/simple-npm-package@0.0.1
4npm notice === Tarball Contents ===
5npm notice 1.1kB LICENSE
6npm notice 1.2kB README.md
7npm notice 95B index.js
8npm notice 690B package.json
9npm notice === Tarball Details===
10npm notice name: @clarkio/simple-npm-package
11npm notice version: 0.0.1
12npm notice filename:@clarkio/simple-npm-package-0.0.1.tgz
13npm notice package size:1.7 kB
14npm notice unpacked size: 3.1 kB
15npm notice shasum:40ede3ed630fa8857c0c9b8d4c81664374aa811c
16npm notice integrity:sha512-QZCyWZTspkcUXL... ]L60ZKBOOBRLTg==
17npm notice total files:4
18npm notice
19+ @clarkio/simple-npm-package@0.0.1

3. En la terminal, ejecuta npm publish --access=public para publicar el paquete en npm. Nota: --access=public es necesario para los paquetes con ámbito (@clarkio/modern-npm-package), ya que son privados de forma predeterminada. Si el paquete no tiene ámbito y el campo private no está establecido en true en tu archivo package.json, también será público.

1> npm publish --access=public
2npm notice
3npm notice 📦@clarkio/simple-npm-package@0.0.1
4npm notice === Tarball Contents ===
5npm notice 1.1kB LICENSE
6npm notice 1.2kB README.md
7npm notice 95B index.js
8npm notice 690B package.json
9npm notice === Tarball Details===
10npm notice name: @clarkio/simple-npm-package
11npm notice version: 0.0.1
12npm notice filename:@clarkio/simple-npm-package-0.0.1.tgz
13npm notice package size:2.1 kB
14npm notice unpacked size: 4.1 kB
15npm notice shasum:6f335d6254ebb77a5a24ee729650052a69994594
16npm notice integrity:sha512-VZ1K1eMFOKeJW[...]7ZjKFVAxLcpdQ==
17npm notice total files:4
18npm notice
19This operation requires a one-time password.
20Enter OTP: <OTP>
21+ @clarkio/simple-npm-package@0.0.1

¡Listo! Ya creaste y desplegaste tu propio paquete npm. A continuación, aprenderás a crear un paquete más sólido, listo para entornos de producción y para que tenga un uso más amplio.

Paquete npm listo para producción

Aunque el paquete del ejemplo anterior podría usarse en producción, requiere trabajo manual para mantenerlo a lo largo del tiempo. Usar herramientas y automatización, junto con pruebas adecuadas y verificaciones de seguridad, ayudará a reducir el esfuerzo necesario para que el paquete siga funcionando sin problemas. Veamos con más detalle qué implica.

En las siguientes secciones veremos cómo:

1. Configurar tu proyecto modern-npm-package

2. Crear paquetes en formato de módulo ECMAScript (ESM)

3. Configurar y escribir pruebas unitarias

4. Implementar verificaciones de seguridad

5. Automatizar la administración de versiones y la publicación

Si no tienes un proyecto propio para seguir este artículo, puedes usar como referencia el siguiente proyecto de ejemplo: https://github.com/snyk-snippets/modern-npm-package.

Crear paquetes en formato de módulo ECMAScript

El formato de módulo ECMAScript es compatible de forma nativa con Node.js desde la versión 12+, y la versión más reciente con soporte a largo plazo es la 22.x. Además, en el entorno de ejecución de JavaScript hay más competencia, con opciones como Bun.js y Deno. Todo esto facilita enfocarse en el formato ESM. Usaremos TypeScript para preparar tu paquete npm y que use el formato ESM.

• Primero, crea un archivo de configuración de TypeScript llamado tsconfig.json. Este archivo contiene los ajustes de compilación que se usarán al crear tu paquete con ESM. Puedes adaptarlo a las necesidades de tu proyecto. En particular, tendrás que ajustar la propiedad files para que coincida con la estructura de tu proyecto si no usas el ejemplo proporcionado.

1{
2    "compilerOptions": {
3      "lib": ["ES2024", "DOM"],
4      "target": "ES2024",
5      "module": "NodeNext",
6      "moduleResolution": "NodeNext",
7      "outDir": "./lib/",
8      "declarationDir": "./lib/types",
9      "strict": true,
10      "esModuleInterop": true,
11      "forceConsistentCasingInFileNames": true,
12      "skipLibCheck": true,
13      "checkJs": true,
14      "allowJs": true,
15      "declaration": true,
16      "declarationMap": true,
17      "allowSyntheticDefaultImports": true
18    },
19    "files": ["./src/index.ts"]
20  }

• La propiedad lib le indica a TypeScript a qué tipos debe hacer referencia para ayudarte a escribir el código de tu proyecto.

• La propiedad target le indica a TypeScript a qué versión de JavaScript debe compilar el código de tu proyecto.

• La propiedad module le indica a TypeScript qué formato de módulo de JavaScript debe usar al compilar el código de tu proyecto.

• La propiedad moduleResolution ayuda a TypeScript a determinar cómo debe resolverse una instrucción «import».

• Las propiedades outDir y declarationDir le indican a TypeScript dónde colocar los resultados de la compilación del código y las definiciones de los tipos que se usan en él.

2. Actualiza el archivo package.json con un campo files que apunte a la carpeta lib, donde se guardan los resultados de la compilación del paquete con TypeScript.

3. Actualiza los campos main y types del archivo package.json para que apunten al resultado del paquete compilado. Esto sirve como opción predeterminada de respaldo.

1"types": "./lib/index.d.ts",
2  "main": "./lib/index.js",

4. Agrega un campo files al archivo package.json para indicar qué archivos debe incluir npm al empaquetar el código para su publicación.

1"files": [
2   "lib/**/*"
3],

5. Crea comandos mediante el campo scripts de package.json para usar tsc y compilar el paquete. Esto generará los archivos de origen para la carpeta lib.

1    "clean": "del-cli ./lib",
2    "build": "npm run clean && tsc -p ./tsconfig.json",
3    "prepack": "npm run build",

• El script clean elimina los resultados de compilaciones anteriores para empezar desde cero.

• El script build limpia los archivos de salida anteriores y usa el compilador de TypeScript para compilar el paquete en el directorio de salida.

• npm usa el script prepack antes de empaquetar el paquete npm como preparación para publicarlo en un registro.

6. Ahora debes instalar las dependencias de desarrollo necesarias para que todo esto funcione. Ejecuta npm install -D typescript del-cli

7. Ahora puedes ejecutar npm run build en la terminal para que TypeScript compile tu proyecto y lo deje listo para usar y publicar.

Eso es todo lo que necesitas configurar para usar TypeScript al crear tu paquete npm, compatible con los formatos de módulo CommonJS y ECMAScript. A continuación, aprenderás a configurar y ejecutar pruebas en el código de tu paquete npm para comprobar que produce los resultados esperados.

Configurar y agregar pruebas

Para confiar en el comportamiento y los resultados de tu código, debes implementar un proceso de pruebas. Las pruebas te obligan a pensar en las distintas funcionalidades de tu código, más allá del camino habitual y sin errores que sueles seguir al crearlo. Por ejemplo, puedes pensar en formas de hacer que una función falle para que genere un error o produzca un resultado inesperado. Esto hará que tu aplicación sea más resiliente y sostenible, y ayudará a garantizar que nada se rompa cuando le agregues más funcionalidades.

Si quieres profundizar en las pruebas y conocer sus buenas prácticas, no dejes de leer el repositorio de buenas prácticas de JavaScript de Yoni Goldberg.

Pruebas unitarias

Para asegurarte de que tu paquete se comporte como quieres, debes escribir pruebas para el código. Necesitarás algunas herramientas para configurar tu proyecto y ejecutar pruebas unitarias, además de mostrar los resultados. Estas herramientas ya están disponibles como módulos integrados en Node.js (desde las versiones 20.x y 18.x, y la 16.17.x detrás de una marca experimental). Sigue estos pasos para configurar y ejecutar pruebas para tu paquete npm:

1.  Instala las dependencias de desarrollo con el siguiente comando en la terminal: npm i -D @types/node

2. Crea una carpeta tests en el directorio raíz de tu proyecto.

3. Crea un archivo index.test.ts en la carpeta tests.

4. Escribe pruebas unitarias en el archivo index.test.ts para probar el código de index.ts.

Nota: puedes consultar como ejemplo el repositorio del paquete npm de muestra: https://github.com/snyk-snippets/modern-npm-package.

5. Agrega una propiedad tests en la sección scripts del archivo package.json y asígnale el valor node --experimental-strip-types --test

1  "scripts": {
2     "clean": "del-cli ./lib",
3    "build": "npm run clean && tsc -p ./tsconfig.json",
4    "prepack": "npm run build",
5    "test": "node --experimental-strip-types --test",
6
7  },

6. Ejecuta npm test en la terminal, desde la carpeta raíz del proyecto, para ejecutar las pruebas y ver los resultados:

1> @snyk-labs/modern-npm-package@0.0.0-development test
2> node --experimental-strip-types --test
3
4(node:83429) ExperimentalWarning: Type Stripping is an experimental feature and might change at any time
5(Use `node --trace-warnings ...` to show where the warning was created)
6(node:83430) ExperimentalWarning: Type Stripping is an experimental feature and might change at any time
7(Use `node --trace-warnings ...` to show where the warning was created)
8▶ NPM Package
9  ✔ should be an object (0.754083ms)
10  ✔ should have a helloWorld property (0.518958ms)
11✔ NPM Package (1.754875ms)
12▶ Hello World Function
13  ✔ should be a function (0.136667ms)
14  ✔ should return the hello world message (0.063791ms)
15✔ Hello World Function (0.270417ms)
16▶ Goodbye Function
17  ✔ should be a function (0.13275ms)
18  ✔ should return the goodbye message (0.159541ms)
19✔ Goodbye Function (0.552542ms)
20ℹ tests 6
21ℹ suites 3
22ℹ pass 6
23ℹ fail 0
24ℹ cancelled 0
25ℹ skipped 0
26ℹ todo 0
27ℹ duration_ms 113.692542

Pruebas en un pipeline

Ahora que tienes pruebas para validar el comportamiento de tu código, puedes usarlas en un pipeline. Esto ayudará a garantizar que ningún cambio introducido en tu repositorio altere el comportamiento del código. Sigue estos pasos para crear un flujo de trabajo de pruebas como parte del pipeline de tu proyecto.

1. Crea una nueva GitHub Action para tu repositorio: https://github.com/<your-account-or-organization>/<your-repo-name>/actions/new

2. Cambia el nombre del flujo de trabajo a tests.yml

3. Inserta el siguiente script de Snyk GitHub Action en el archivo de flujo de trabajo:

1name: Tests
2
3on:
4  push:
5    branches: [ main ]
6  pull_request:
7    branches: [ main ]
8
9jobs:
10  build:
11
12    runs-on: ubuntu-latest
13
14    strategy:
15      matrix:
16        node-version: [22.x]
17
18    steps:
19      - uses: actions/checkout@v4
20      - name: Use Node.js ${{ matrix.node-version }}
21        uses: actions/setup-node@v4
22        with:
23          node-version: ${{ matrix.node-version }}
24      - run: npm ci
25      - run: npm test

Este script YAML extrae el código más reciente, instala sus dependencias y ejecuta el comando npm test para correr las pruebas. Lo hace con cada versión de Node.js que aparezca en el campo node-version para que puedas comprobar que el código funcione como se espera en cada entorno de ejecución.

Ya terminaste de configurar tu proyecto para ejecutar y evaluar pruebas en el código de tu paquete npm. Sin embargo, quizá te preguntes: «¿Cómo pruebo usando mi paquete npm en otro proyecto?». A continuación, veamos cómo hacerlo.

Pruebas de paquetes

Una cosa es confiar en el código de tu paquete npm gracias a las pruebas unitarias, y otra es asegurarte de que la experiencia de uso del paquete npm en general sea la esperada. Para esto, debes agregar tu paquete npm como dependencia en otro proyecto y comprobar que funcione tan bien como esperas. Estas son cinco formas de probarlo:

1. Instalar mediante el resultado de npm pack

2. Instalar mediante una ruta relativa

3. Instalar mediante npm link

4. Instalar mediante un registro (como el registro público de npm en npmjs.com)

5. Usar Verdaccio (un proyecto de registro privado de npm de código abierto) para ejecutar pasos de publicación e instalación de paquetes de extremo a extremo como parte de tu CI

npm pack

Este enfoque usa el comando npm pack para empaquetar y comprimir tu paquete npm en un solo archivo (<package-name>.tgz). Luego puedes ir al proyecto donde quieres usar el paquete e instalarlo desde ese archivo. Sigue estos pasos:

1. Desde el directorio de tu paquete npm, ejecuta npm pack en la terminal. Anota el archivo .tgz que se genera y dónde se encuentra.

2. Cambia al directorio del proyecto donde quieres usar el paquete npm. Ejemplo: cd /path/to/project

3. Desde el directorio del proyecto client, ejecuta npm install /path/to/package.tgz, reemplazando la ruta por la ubicación correcta del archivo .tgz del paso 1

4. Luego podrás empezar a usar el paquete en ese proyecto client para probarlo

Esta opción ofrece la experiencia más cercana a producción al usar tu paquete npm.

npm link

Este enfoque usa el comando npm link para apuntar al directorio de tu paquete cuando intentas instalarlo en proyectos client. Sigue estos pasos:

1. Desde el directorio de tu paquete npm, ejecuta npm link en la terminal

2. Cambia al directorio del proyecto donde quieres usar el paquete npm. Ejemplo: cd /path/to/project

3. Desde el directorio del proyecto client, ejecuta npm link <name-of-your-package>

Esto hará que tu proyecto client apunte al directorio del paquete npm cuando hagas referencia al paquete en el código. No ofrece una experiencia de uso totalmente similar a la de producción, pero sí te permite comprobar que la funcionalidad se comporte como esperas.

Ruta relativa

Este enfoque aprovecha lo que ya sabes sobre el comando npm install. Es similar a npm link, pero no necesitas aprender un comando nuevo como link.

1. Desde el directorio de tu proyecto client, ejecuta npm install /path/to/your/package en la terminal.

Al igual que el enfoque de npm link, esta opción te permite probar rápidamente la funcionalidad de tu paquete en un proyecto cliente, pero no ofrece una experiencia totalmente similar a la de producción. Esto se debe a que apunta al directorio completo del código fuente del paquete y no a una versión compilada, como la que encontrarías en un registro de npm.

Registro de npm

Este enfoque aprovecha el registro público (o uno propio) de paquetes npm. Consiste en publicar tu paquete e instalarlo como lo harías normalmente con cualquier otro paquete npm.

1. Publica tu paquete npm siguiendo los pasos descritos anteriormente en este artículo con el comando npm publish

2. Cambia al directorio del proyecto donde quieres usar el paquete npm. Ejemplo: cd /path/to/project

3. Desde el directorio del proyecto client, ejecuta npm install <name-of-your-package>

¡Gracias a Mirco Kraenz (@MKraenz), quien creó un hilo en Twitter para resumir lo que aprendimos sobre esto durante una transmisión en vivo!

En este punto, ya compilaste tu paquete para que admita formatos de módulos modernos y verificaste que funcione como se espera mediante pruebas unitarias y de empaquetado. Ahora debes asegurarte de que no haya problemas de seguridad y evitar que aparezcan nuevos en tu paquete npm.

Implementar verificaciones de seguridad

Así como no quieres vulnerabilidades de seguridad en tus propios proyectos, tampoco quieres introducirlas en los proyectos de otras personas. Crear un paquete npm que se espera que se use en muchos otros proyectos implica una mayor responsabilidad de garantizar su seguridad. Necesitas implementar verificaciones de seguridad que ayuden a monitorear las vulnerabilidades, enviar alertas y ofrecer ayuda para mitigarlas. Una herramienta como Snyk puede simplificar el trabajo necesario para lograrlo.

En este ejemplo de paquete npm, usas GitHub como herramienta de control de código fuente, así que aprovecharás GitHub Actions para integrar Snyk en tu flujo de trabajo. Snyk tiene un proyecto de referencia de GitHub Actions que te ayuda a empezar y ofrece ejemplos para otros lenguajes de programación y herramientas que podrías usar en tus proyectos.

1. Snyk es gratis, así que regístrate y obtén tu Snyk API Token.

2. Agrega tu Snyk API Token como secreto del repositorio en GitHub: https://github.com/<your-account-or-organization>/<your-repo-name>/settings/secrets/actions/new

3. Crea una nueva GitHub Action para tu repositorio: https://github.com/<your-account-or-organization>/<your-repo-name>/actions/new

4. Cambia el nombre del flujo de trabajo a snyk.yml.

5. Inserta el siguiente script de Snyk Action en el archivo de flujo de trabajo:

1name: Snyk Security Check
2on: [push,pull_request]
3jobs:
4  security:
5    runs-on: ubuntu-latest
6    steps:
7      - uses: actions/checkout@main
8      - name: Run Snyk to check for vulnerabilities
9        uses: snyk/actions/node@master
10        env:
11          SNYK_TOKEN: ${{ secrets.SNYK_TOKEN }}

6. Confirma tus cambios.

7. Verifica que la Action se haya ejecutado correctamente: https://github.com/<your-account-or-organization>/<your-repo-name>/actions

Una vez configurado, cada vez que alguien haga push a tu repositorio o abra un pull request contra él, se ejecutará una verificación de seguridad para asegurarse de que no se introduzcan vulnerabilidades en el paquete. Si detecta algún problema, la Action fallará y te enviará una alerta con los detalles. A continuación, automatizarás el proceso de administración de versiones y publicación de tu paquete npm.

¿Quieres conocer los problemas de seguridad antes de que se haga push de los cambios a tu repositorio? Instala el plugin de Snyk para la herramienta de desarrollo que prefieras. ¿Prefieres usar herramientas de CLI? Agrega Snyk CLI a tu cadena de herramientas. Estas opciones te ayudarán a detectar problemas de seguridad mientras desarrollas y a recibir alertas antes en el flujo de trabajo de tu proyecto.

Ten en cuenta que esta configuración solo usa el producto Snyk Open Source (SCA), no Snyk Code (SAST). Snyk Code es nuestro producto de seguridad de código. Para aprovecharlo al máximo, primero debes habilitarlo gratis desde tu cuenta de Snyk y luego agregarlo al script de tu flujo de trabajo. Para obtener más información sobre cómo usar Snyk Code en tu pipeline, lee este artículo: Cómo crear un pipeline seguro con GitHub Actions (usa Java y Maven, pero puedes reemplazarlos por Node.js y npm).

Automatizar la administración de versiones y la publicación

Cada vez que integras cambios en tu rama principal, no quieres actualizar manualmente la versión del paquete npm y publicarlo. En su lugar, querrás automatizar este proceso. Si recuerdas el ejemplo sencillo de un paquete npm que vimos anteriormente en esta publicación, usaste el siguiente comando para publicar tu paquete npm:

1npm publish

También debes seguir el estándar del sector de versionado semántico, para que quienes usan tu paquete entiendan las implicaciones de los distintos cambios de versión que publiques en el registro.

¿Qué es el versionado semántico?

El versionado semántico establece que el número de versión tenga tres componentes: el primero corresponde a la versión principal, el segundo a la versión secundaria y el último a la versión de parche. Para obtener más información sobre el versionado semántico, la administración de versiones y los archivos de bloqueo, lee Qué es package-lock.json y cómo funciona un archivo de bloqueo con los paquetes de Yarn y NPM

¿Y si pudieras evitar hacer todo eso manualmente y, en su lugar, configurar un flujo de trabajo automatizado con GitHub Actions que publique los paquetes npm por ti? Estás de suerte: existe una herramienta llamada Semantic Release que se integra con GitHub Actions. La clave para automatizar este proceso es usar lo que se conoce como commits convencionales al confirmar cambios en tu proyecto. Así, la automatización puede actualizar todo de manera adecuada y preparar la siguiente versión de tu proyecto por ti.

Sigue estos pasos para configurar todo esto en tu paquete npm moderno.

1. En la terminal, ejecuta: npm i -D semantic-release

2. En la terminal, ejecuta: npx semantic-release-cli setup

3. Sigue las indicaciones de la terminal y proporciona los tokens necesarios:

• Necesitarás un token de acceso personal de GitHub. Para crear uno, ve a https://github.com/settings/tokens/new?scopes=public_repo

• Al crear este token, usa los siguientes permisos:

• Haz clic en el botón “Generate token”, luego copia y guarda el valor que aparece en la página.

• También necesitarás un token de acceso de tipo Automation de npm, que se usará exclusivamente en entornos de CI para que pueda sortear la autenticación de dos factores de tu cuenta. Para crear uno, ve a https://www.npmjs.com/settings/<your-npm-account>/tokens. Asegúrate de seleccionar el tipo “Automation”, ya que se usará en un flujo de trabajo de CI/CD.

1bc@mbp-snyk modern-npm-package % npx semantic-release-cli setup
2? What is your npm registry? https://registry.npmjs.org/
3? What is vour nom username? clarkio
4? What is your pm password? [hidden]
5? What is your NPM two-factor authentication code? <2FA code>
6Provide a GitHub Personal Access Token (create a token at https://github.com/settings/tokens/new?scopes=repo
7<token>
8? What CI are you using? Github Actions
9bc@mbp-snyk modern-npm-package %

4. Agrega tu token de npm al repositorio de GitHub como secreto del repositorio aquí: https://github.com/<your-name-or-organization>/<your-repository>/settings/secrets/actions/new. Asigna al secreto el nombre NPM_TOKEN y como valor usa el que obtuviste en un paso anterior

5. Vuelve a tu proyecto, abre el archivo package.json y agrega una clave releases como la siguiente. Si la rama principal de tu repositorio todavía se llama master y no main, actualiza el valor de branches anterior según corresponda.

1"release": {
2    "branches": ["main"]
3  }

6. Agrega también una clave publishConfig al archivo package.json:

1"publishConfig": {
2    "access": "public"
3 }

7. Prueba todo con una ejecución de prueba mediante el script npm semantic-release. Usa el siguiente comando y asigna a NPM_TOKEN= y GH_TOKEN= los valores de tus respectivos tokens. Luego copia y ejecuta el comando completo en la terminal para comprobar que todo funcione correctamente. El proceso quedará registrado en la salida de la terminal. Si surge algún problema, aparecerá allí junto con detalles para resolverlo.

8. Después de confirmar que la ejecución de prueba finaliza correctamente, puedes configurar tu repositorio de GitHub con una nueva GitHub Action para que se encargue del proceso de publicación. Ve a tu repositorio en GitHub y haz clic en “Actions”.

9. Haz clic en la opción New workflow.

10. Cambia el nombre del flujo de trabajo a release.yml.

11. Agrega el siguiente script YAML al nuevo archivo de flujo de trabajo. En esencia, este script indica que, cuando la verificación de seguridad de Snyk termine correctamente, se ejecute el trabajo de publicación. Este trabajo extrae el código, configura un entorno de Node.js, instala las dependencias y luego ejecuta semantic-release con tus tokens de GitHub y npm.

1name: Release
2on:
3  workflow_run:
4    workflows: ['Snyk Security Check', 'Tests']
5    branches: [main]
6    types:
7      - completed
8
9permissions:
10  contents: read
11
12jobs:
13  release:
14    name: Release
15    runs-on: ubuntu-latest
16    permissions:
17      contents: write # to be able to publish a GitHub release
18      issues: write # to be able to comment on released issues
19      pull-requests: write # to be able to comment on released pull requests
20      id-token: write
21    steps:
22      - name: Checkout
23        uses: actions/checkout@v4
24        with:
25          fetch-depth: 0
26      - name: Setup Node.js
27        uses: actions/setup-node@v4
28        with:
29          node-version: 'lts/*'
30      - name: Install dependencies
31        run: npm ci
32      - name: Verify the integrity of provenance attestations and registry signatures for installed dependencies
33        run: npm audit signatures
34      - name: Release
35        env:
36          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
37          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
38        run: npx semantic-release

En esencia, este script indica que, cuando la verificación de seguridad y las pruebas de Snyk terminen correctamente, se ejecute el trabajo de publicación. Este trabajo extrae el código, configura un entorno de Node.js, instala las dependencias y luego ejecuta semantic-release con tus tokens de GitHub y npm.

• Nota: GitHub Actions incluye de forma predeterminada un secreto o variable de entorno GITHUB_TOKEN, así que no es necesario proporcionar el token de acceso personal en este entorno. El PAT solo se usa para probar localmente tu configuración de semantic-release.

12. Confirma los cambios locales y haz push a tu repositorio de GitHub

• Puedes hacerlo ejecutando el comando git commit -am '<your commit message>' en la terminal y luego git push.

• También puedes hacerlo en VS Code mediante su funcionalidad de control de versiones.

13. Una vez que hayas configurado todo, puedes usar conventional commits para enviar cambios a tu rama principal (o mediante la fusión de pull requests), y se ejecutará el flujo de trabajo de publicación (por supuesto, después de la verificación de seguridad de Snyk). Puedes ver un ejemplo de esto en el flujo de trabajo del repositorio modern-npm-package.

Monitoreo continuo de seguridad con Snyk a través de GitHub

Aunque es beneficioso incluir verificaciones de seguridad directamente en el proceso en el que confirmas tu código, podrías pasar por alto vulnerabilidades que surjan entre una confirmación y otra. Por ejemplo, si no has enviado código a tu repositorio en unos meses, no sabrás si durante ese tiempo se descubrieron nuevas vulnerabilidades. Aquí es donde Snyk te ayuda aún más. Cuando conectas tu repositorio de GitHub a Snyk, este monitorea automáticamente las nuevas vulnerabilidades y te avisa, sin importar con qué frecuencia trabajes en el proyecto. Además, crea pull requests automatizados para ayudarte a resolver los problemas de seguridad.

Hay dos productos de Snyk que son especialmente útiles para garantizar la seguridad del código y las dependencias de tu paquete npm. Snyk Code ayuda a proteger el código de tu paquete, mientras que Snyk Open Source monitorea tus dependencias de código abierto para detectar vulnerabilidades.

Para empezar a aprovechar al máximo tu cuenta gratuita de Snyk, sigue estos pasos:

1. Inicia sesión en tu cuenta gratuita de Snyk

2. Elige Agregar proyecto y luego GitHub.

3. Busca el repositorio de tu proyecto por nombre y marca la casilla que aparece junto a él.

4. Confirma que el repositorio se haya importado correctamente a Snyk.

Empieza a crear paquetes npm modernos

Resumamos todo lo que aprendiste en este artículo. Primero, aprendiste a configurar, crear e implementar un paquete npm sencillo. Esto te sirvió para familiarizarte con lo que implica publicar tu propio paquete npm por primera vez. Sin embargo, seguir este proceso es bastante manual y poco sostenible si quieres crear un paquete npm para usar en producción.

Para crear un paquete listo para producción, también aprendiste a compilar en los formatos de módulos CommonJS (CJS) y ECMAScript (ESM), configurar y escribir pruebas unitarias, implementar verificaciones de seguridad y automatizar la administración de versiones y la publicación. Con estos conocimientos, ya puedes crear muchos más paquetes npm propios que la comunidad o tu empresa puedan consumir fácilmente.

Prueba el verificador de código JavaScript gratuito de Snyk para encontrar y corregir vulnerabilidades en tu código.