Comment créer et publier votre premier package NPM privé

Dans cet article, je veux montrer comment nous pouvons facilement créer notre premier package npm privé .

Nous allons créer et publier un package privé sur GitHub , alors assurez-vous de vous être familiarisé avec les prérequis avant de commencer cet article. Alors, commençons.

Conditions préalables:

• créez un compte GitHub ( si vous n'en avez pas encore )

  
  

• lire l'article Comment configurer un Node Express avec TypeScript

  
  

• lisez l'article How to Setup a CI CD Pipeline From Scratch with GitHub Actions ( Je vous recommande fortement de lire cet article pour comprendre le fonctionnement de GitHub Actions si vous n'êtes pas familier avec GitHub Actions )

Qu'est-ce que les packages npm privés et où peuvent-ils être utilisés ?

• Avec les packages npm privés, vous pouvez héberger du code qui n'est visible que par vous et ceux qui y ont accès, ce qui vous permet de gérer et d'utiliser du code privé parallèlement au code public dans vos projets.

Structure du projet

 math-lib/ --.github/ --workflows/ --main.yml --build/ this is autogenerated folder --src/ --app.ts --types/ --index.d.ts --.gitignore --package.json --tsconfig.json

Partie 1 : Construire un package npm privé

Étape 1 : Initialisez un projet Node.js avec TypeScript.

Remarque : vous pouvez apprendre à le faire en suivant cet article Comment configurer un Node Express avec TypeScript ou vous pouvez simplement cloner ce dépôt https://github.com/YuraAbharian/node-express-typescript

Étape 2 : créons maintenant des workflows GitHub Actions.

• Créer un .github/workflows

  
  

• Dans le .github/workflows , créez un fichier main.yml

  
  

• Vous pouvez vous familiariser avec les flux de travail GitHub Actions en suivant cet article Comment configurer un pipeline de CD CI à partir de zéro avec GitHub

Ajoutons quelques configurations :

 name: Node.js Private Package on: push: branches: - master jobs: publish-gpr: runs-on: ubuntu-latest steps: - uses: actions/checkout@v2 - uses: actions/setup-node@v2 with: node-version: '14.x' registry-url: 'https://npm.pkg.github.com/' - run: npm install - run: npm run build - run: npm publish env: NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}}

Note : Souvenez-vous de GITHUB_TOKEN, nous en reparlerons un peu plus tard

Étape 3 : Créons/mettons à jour le fichier src/app.ts

 export function sum(a: number, b: number): number { return a + b; } export function minus(a: number, b: number): number { return a - b; } export function divide(a: number, b: number): number { return a / b; } export function multiple(a: number, b: number): number { return a * b; }

Étape 4 : Nous devons maintenant déclarer un module pour notre package

• Créez un répertoire de types à la racine de votre projet

  
  

• Créer un fichier index.d.ts dans le répertoire types

  
  

Ajouter des types de déclaration pour ce module

 declare module "@GITHUB_USERNAME/PACKAGE_NAME" { function sum(a: number, b: number): number; function minus(a: number, b: number): number; function divide(a: number, b: number): number; function multiple(a: number, b: number): number; }

Noter:

- GITHUB_USERNAME c'est votre nom d'utilisateur github

- PACKAGE_NAME c'est le nom de votre package privé

Exemple : "@yuraabharian/math-lib"

Étape 5 : Travaillons sur le fichier package.json

 { "name": "@GITHUB_USERNAME/PACKAGE_NAME", "version": "1.0.0", "description": "", "main": "./build/app.js", "author": "", "license": "ISC", "types": "./types/index.d.ts", "publishConfig": { "registry": "https://npm.pkg.github.com/" }, "repository": { "url": "git://github.com/GITHUB_USERNAME/PACKAGE_NAME.git" }, "scripts": { "build": "npx tsc" }, "devDependencies": { "@types/node": "^18.0.0", "typescript": "^4.7.4" } }

Exemple : git://github.com/yuraabharian/math-lib.git (ce sera un lien vers votre référentiel GitHub)

Remarque : Ces champs @GITHUB_USERNAME/PACKAGE_NAME sont les mêmes qu'à l' étape 4

Étape 6 : Configurons notre environnement de référentiel avant de pousser le code

• À l' étape 2 , je vous ai demandé de vous souvenir de GITHUB_TOKEN car cette variable est très importante.

  
  

• Accédez au GitHub Repository - Settings

  
  

Étape 7 : Allez ensuite dans Secrets

Étape 8 : Ouvrir Actions

• Cliquez sur New repository secret

Obligatoire : suivez ce lien https://docs.github.com/en/authentication/keeping-your-account-and-data-secure/creating-a-personal-access-token pour générer un nouveau jeton.

Remarque : enregistrez le GITHUB_TOKEN ailleurs car nous en aurons besoin dans la partie 2 de cet article .

Remarque : n'accordez qu'un accès en write:packages à ce jeton

Étape 9 : Poussons maintenant notre code vers GitHub

Étape 10 : Ouvrez le Repository → Actions et vous devriez voir que votre package a été déployé

Étape 11 : Pour trouver votre package, accédez à votre profil GitHub → Packages

Conclusion de la première partie : à ce stade, vous devriez voir votre package déployé

Dans la seconde partie de cet article, nous allons apprendre à installer un package privé car il nécessite quelques actions, en plus npm install package .

Partie 2 : Installation et test

Étape 1 : Configurer le projet Node.js

Remarque : vous pouvez voir comment procéder dans la partie 1 → étape 1

Étape 2 : Ensuite, à la racine du projet, installez tout votre package. Le lien vers votre package que vous pouvez prendre par profil GitHub → Packages → math-lib (c'est le nom de votre package)

Étape 3 : Allez maintenant dans le fichier src/app.ts et mettez-le à jour

 import express, {Application, Request, Response} from 'express'; import {sum, minus, multiple, divide} from '@yuraabharian/math-lib'; const app: Application = express(); const PORT: number = 3001; app.use('/sum', (req: Request, res: Response): void => { res.send(`RESULT: ${sum(5, 2)}`, ); }); app.use('/minus', (req: Request, res: Response): void => { res.send(`RESULT: ${minus(2, 2)}`); }); app.use('/multiple', (req: Request, res: Response): void => { res.send(`RESULT: ${multiple(12, 2)}`); }); app.use('/divide', (req: Request, res: Response): void => { res.send(`RESULT: ${divide(10, 2)}`); }); app.listen(PORT, (): void => { console.log('SERVER IS UP ON PORT:', PORT); });

Remarque : Gardez à l'esprit que j'importe math-lib depuis mon dépôt @yuraabharian/math-lib pour que votre modèle ressemble à @GITHUB_USERNAME/PACKAGE_NAME

Étape 4 : Exécutez votre projet npm start

 node-express-typescript % npm start > [email protected] start > npx tsc && node build/app.js SERVER IS UP ON PORT: 3001

Étape 5 : Accédez à votre navigateur et ouvrez http://localhost:3001/sum

Cela fonctionne, alors testons maintenant toutes les méthodes :

• http://localhost:3001/multiple

• http://localhost:3001/moins

• http://localhost:3001/diviser

Résumé : Dans cet article, nous avons créé et testé votre premier package npm privé, j'espère que vous avez apprécié mon article. Si vous avez des questions, vous pouvez me contacter par e-mail, LinkedIn ou dans les commentaires. Meilleurs vœux