Webux Lab

Par Studio Webux

Lint staged

TG
Tommy Gingras Studio Webux S.E.N.C 2021-04-30

Introduction

Lint staged est un outil complet et facile à utiliser spécialisé pour lint les fichiers avant de pouvoir faire un commit.

Comment l’utiliser

Les commandes sont lancées avec Git Bash

À la racine de votre projet, lancer ce qui suit,

Il est très important de lancer la commande en utilisant le --save-dev pour seulement installer les packages suivant en mode développement. C’est important pour des raisons d’optimisation et de sécurité.

npm install --save-dev lint-staged

Configurer lint-staged

Votre package.json doit avoir ces nouvelles lignes:

{
  "devDependencies": {
    "husky": "^6.0.0",
    "lint-staged": "^10.5.4"
  },
  "scripts": {
    "prepare": "husky install",
    "pre-commit": "lint-staged"
  },
  "lint-staged": {
    "packages/**/*.js": "eslint"
  }
}

Dans cet exemple, eslint est installé globalement.

Pour la section lint-staged vous devez ajouter le(s) répertoire(s) qui seront utilisés pour lancer la commande spécifiée, Dans l’exemple ci-dessus tous les fichiers .js dans le répertoire packages/ et ses sous-répertoires seront analysés lors de la création d’un commit.

Dans le cas où le linter retourne une erreur, le commit n’est pas créé et l’erreur est affichée sur votre console, vous devez ainsi corriger l’erreur, refaire un git add, puis vous allez être en mesure de faire votre commit.

Ajouter le git hook

Pour utiliser cet outil, il faut ajouter un git hook, pour ce faire nous allons utiliser le module Husky

npm install --save-dev husky
npx husky install

Puis vous devez créer un fichier dans le répertoire de .husky/

Créer un fichier nommé pre-commit, puis ajouter le contenu suivant:

#!/bin/sh
. "$(dirname "$0")/_/husky.sh"

npm run pre-commit

Structure

.husky/
    _/
    .gitignore
    pre-commit
package.json
license.txt
README.md

Donc à partir de maintenant, la création d’un commit est seulement autorisée si le code ajouté est lint correctement.

Comment ignorer les hooks

Vous pouvez tout simplement ajouter --no-verify à votre commande git.

par exemple,

git commit -m "fix: removed invalid code" --no-verify

Exemple

package.json

{
  "devDependencies": {
    "husky": "^6.0.0",
    "lint-staged": "^10.5.4"
  },
  "scripts": {
    "prepare": "husky install",
    "pre-commit": "lint-staged"
  },
  "lint-staged": {
    "lambdas/**/*.js": "eslint",
    "infrastructure/*.{yml,yaml}": "cfn-lint",
    "frontend/**/*.{js,vue}": "eslint"
  }
}

Selon le fichier modifié dans le commit, l’outil utilisé peut être différent.

Conclusion

Voir les articles suivants pour plus d’information:


Recherche