1.0.8 • Published 2 years ago

eslint-config-woo v1.0.8

Weekly downloads
-
License
ISC
Repository
-
Last release
2 years ago

Woopear EsLint

Avant de débuter, intaller le plugin eslint sur vscode

Les installations

Si le projet n'a pas initialisé ESLINT (not files eslintrc.js)

si vous n'avez pas de fichier eslintrc.js ou eslintrc.cjs

  • Installation des packages :
$ npm i --save-dev @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint eslint-config-prettier eslint-plugin-prettier tslint typescript eslint-plugin-css-modules eslint-plugin-html eslint-config-woopear
  • initialisé eslint
$ ./node_modules/.bin/eslint --init

puis entrez les informations demandées par le CLI
ATTENTION vous devrez choisir un framework et aucune préconfiguration eslint divers
Après avoir terminé la configuration, le fichier eslintrc sera créé

  • Ajouter ou remplacer le code du fichier eslintrc

copier coller le code ci-dessous dans votre fichier

module.exports = {
  env: {
    browser: true,
    commonjs: true,
    es2021: true,
  },
  extends: ['woopear', 'plugin:css-modules/recommended'],
  parser: '@typescript-eslint/parser',
  parserOptions: { ecmaVersion: 12 },
  plugins: ['@typescript-eslint', 'html', 'css-modules'],
};

redémarré vscode pour s'assurer que tout fonctionne

Si ESLINT est déja initialisé

Vous possèdez déja une fichier eslintrc
qui à été creer au moment de l'installation de votre framework
ici nous allons exposer l'installation NestJS. dans les faits le principe reste le meme dans tout les frameworks

L'installation avec svelte/sveltekit cliquer sur le lien ci-dessous
installation eslint-woopear sur svelte/sveltekit

Installation NestJS

  • installation du package eslint-woopear
$ npm i eslint-config-woopear
  • modification du fichier eslintrc

proprieté : parserOptions

parserOptions: {
  project: 'tsconfig.json',
  tsconfigRootDir: __dirname,
  sourceType: 'module',
},

proprieté : extends

extends: [
  'woopear',
  'plugin:@typescript-eslint/recommended',
  'plugin:prettier/recommended',
],

Paramettrer vscode

Pour que l'extension prettier fonctionne avec notre linter,
veuillez copier-coller ses lignes dans le fichier settings.json de votre vscode.
(pour le trouver tapez : ctrl + p (window))
et choisissez le paramètre de format : json
collez ces lignes à la fin du fichier

"[javascript]": {
    "editor.formatOnSave": false
  },
  "[typescript]": {
    "editor.formatOnSave": false
  },
  "editor.codeActionsOnSave": {
    "source.fixAll": true
  }

Définition des régles

Régles basique

RéglesDéfinition
for-directionappliquer la clause de mise à jour de la boucle "for" en déplaçant le compteur dans la bonne direction
getter-returnappliquer les instructions « return » dans les getters
no-cond-assigninterdire les opérateurs d'affectation dans les expressions conditionnelles
no-console (pas utilisé)interdit les consoles à utiliser pour la prod
no-dupe-argsinterdire les arguments en double dans les définitions de « fonction »
no-dupe-else-ifinterdire les conditions en double dans les chaînes if-else-if
no-dupe-keysinterdire les clés en double dans les littéraux d'objet
no-emptyinterdire les instructions de bloc vides
no-extra-parensinterdire les parenthèses inutiles
no-func-assigninterdire la réaffectation des déclarations de « fonction »
no-inner-declarationsinterdire les déclarations de variables ou de "fonctions" dans les blocs imbriqués
no-obj-callsinterdire l'appel des propriétés d'objet globales en tant que fonctions
no-setter-returninterdire le retour de valeurs par les setters
no-sparse-arraysinterdire les tableaux clairsemés
no-template-curly-in-stringinterdire la syntaxe d'espace réservé de littéral de modèle dans les chaînes normales
no-unreachableinterdire le code inaccessible après les instructions return, throw, continue et break
no-unsafe-negationinterdire la négation de l'opérande gauche des opérateurs relationnels

Régles de bonne pratique

RéglesDéfinition
accessor-pairsappliquer des paires getter et setter dans les objets et les classes
array-callback-returnappliquer les instructions « return » dans les rappels de méthodes de tableau
class-methods-use-thisimposer que les méthodes de classe utilisent this
curlyappliquer un style d'accolade cohérent pour toutes les instructions de contrôle
default-caseexiger des cas default dans les instructions switch
default-case-lastappliquer les clauses par défaut dans les instructions switch en dernier
default-param-lastappliquer les paramètres par défaut en dernier (pour les fonctions)
eqeqeqnécessitent l'utilisation de === et !==
max-classes-per-fileimposer un nombre maximum de classes par fichier
no-alert (pas utilisé)interdire l'utilisation de « alerte », « confirmation » et « invite » (decommenter pour prod)
no-constructor-returninterdire l'utilisation de arguments.caller ou arguments.calle
no-empty-functioninterdire les fonctions vides
no-fallthroughinterdire la chute des instructions case
no-multi-spacesinterdire plusieurs espaces
no-newinterdire les "nouveaux" opérateurs en dehors des affectations ou des comparaisons
no-redeclareinterdire la redéclaration de variable
no-return-awaitinterdire les "retours en attente" inutiles
no-script-urlinterdire les URL javascript:
no-self-assigninterdire les affectations où les deux côtés sont exactement les mêmes
no-self-compareinterdire les comparaisons où les deux côtés sont exactement les mêmes
no-throw-literalinterdire de lancer des littéraux comme exceptions
no-unmodified-loop-conditioninterdire les conditions de boucle non modifiées
require-awaitinterdire les fonctions asynchrones qui n'ont pas d'expression « await »
yodaexiger ou interdire les conditions "Yoda" (dans les conditions, la variable en premier enuite en deuxieme l'element à comparer)

régles pour les variables

RéglesDéfinition
no-delete-varinterdire la suppression de variables
no-label-varinterdire le meme nom d'une variable et d'une étiquette
no-unused-varsinterdire les variables inutilisées
no-use-before-defineinterdire l'utilisation de variables avant qu'elles ne soient définies

Régles pour le style

RéglesDéfinition
class-name (pas utilisé)exige une majuscule a la première lettre d'une classe
array-bracket-newlineappliquer les sauts de ligne après l'ouverture et avant la fermeture des crochets du tableau
array-bracket-spacing (pas utilisé)appliquer un espacement cohérent à l'intérieur des crochets du tableau
array-element-newlineappliquer des sauts de ligne après chaque élément du tableau
block-spacinginterdire ou appliquer les espaces à l'intérieur des blocs après l'ouverture du bloc et avant la fermeture du bloc
brace-styleappliquer un style d'accolade cohérent pour les blocs
camelcaseappliquer la convention de nommage camelcase
capitalized-commentsappliquer ou interdire la mise en majuscule de la première lettre d'un commentaire
comma-dangleexiger ou interdire les virgules de fin
comma-spacingappliquer un espacement cohérent avant et après les virgules
computed-property-spacingappliquer un espacement cohérent à l'intérieur des parenthèses de propriétés calculées
eol-lastexiger ou interdire la nouvelle ligne à la fin des fichiers
func-call-spacingexiger ou interdire l'espacement entre les identifiants de fonction et leurs invocations
func-name-matchingexiger que les noms de fonctions correspondent au nom de la variable ou de la propriété à laquelle elles sont affectées
func-namesexiger ou interdire les expressions fonction nommées
func-styleimposer l'utilisation cohérente des déclarations ou des expressions de « fonction »
function-call-argument-newlineappliquer des sauts de ligne entre les arguments d'un appel de fonction
function-paren-newlineappliquer des sauts de ligne cohérents à l'intérieur des parenthèses de fonction
implicit-arrow-linebreakappliquer l'emplacement des corps de fonction de flèche
indentappliquer une indentation cohérente
jsx-quotesappliquer l'utilisation cohérente des guillemets doubles ou simples dans les attributs JSX
key-spacingappliquer un espacement cohérent entre les clés et les valeurs dans les propriétés littérales d'objet
keyword-spacingappliquer un espacement cohérent avant et après les mots-clés
line-comment-position (pas utilisé)appliquer la position des commentaires de ligne
lines-around-commentnécessitent des lignes vides autour des commentaires
lines-between-class-membersexiger ou interdire une ligne vide entre les membres du groupe
max-lenimposer une longueur de ligne maximale
multiline-comment-styleappliquer un style particulier pour les commentaires multilignes
new-capexiger que les noms des constructeurs commencent par une majuscule
new-parensappliquer ou interdire les parenthèses lors de l'appel d'un constructeur sans arguments
newline-per-chained-callnécessite un saut de ligne après chaque appel dans une chaîne de méthode
no-lonely-ifinterdire les instructions 'if' comme seule instruction dans les blocs 'else'
no-mixed-spaces-and-tabsinterdire les espaces mixtes et les tabulations pour l'indentation
no-multi-assigninterdire l'utilisation d'expressions d'affectation chaînées
no-multiple-empty-linesinterdire plusieurs lignes vides
no-negated-conditioninterdire les conditions négatives
no-nested-ternaryinterdire les expressions ternaires imbriquées
no-new-objectinterdire les constructeurs « Object »
no-unneeded-ternaryinterdire les opérateurs ternaires lorsque des alternatives plus simples existent
no-whitespace-before-propertyinterdire les espaces avant les propriétés
object-curly-newlineappliquer des sauts de ligne cohérents après l'ouverture et avant la fermeture des accolades
object-curly-spacingappliquer un espacement cohérent à l'intérieur des accolades
operator-assignmentexiger ou interdire la sténographie de l'opérateur d'affectation dans la mesure du possible
operator-linebreakappliquer un style de saut de ligne cohérent pour les opérateurs
padded-blocksexiger ou interdire le remplissage dans les blocs
padding-line-between-statementsexiger ou interdire les lignes de remplissage entre les instructions
quote-propsexiger des guillemets autour des noms de propriété littéraux d'objet
quotesappliquer l'utilisation cohérente des backticks, des guillemets doubles ou simples
semiexiger ou interdire les points-virgules au lieu de l'ASI
semi-spacingappliquer un espacement cohérent avant et après les points-virgules
semi-styleappliquer l'emplacement des points-virgules
space-before-blocksappliquer un espacement cohérent avant les blocs
space-before-function-parenappliquer un espacement cohérent avant la parenthèse ouvrante de la définition de la "fonction"
space-infix-opsnécessitent un espacement autour des opérateurs infixes
pace-unary-opsappliquer un espacement cohérent avant ou après les opérateurs unaires
spaced-commentappliquer un espacement cohérent après le // ou /* dans un commentaire
switch-colon-spacingappliquer l'espacement autour des deux points des instructions switch
template-tag-spacingexiger ou interdire l'espacement entre les balises de modèle et leurs littéraux

Régles ecmascript 6

RéglesDéfinition
arrow-body-stylenécessitent des accolades autour des corps de fonction de flèche
arrow-parensexiger des parenthèses autour des arguments de la fonction flèche
arrow-spacingappliquer un espacement cohérent avant et après la flèche dans les fonctions de flèche
no-class-assigninterdire la réaffectation des membres du groupe
no-const-assigninterdire la réaffectation des variables const
no-dupe-class-membersinterdire les membres de classe en double
no-duplicate-importsinterdire les importations de modules en double
no-useless-constructor (pas utilisé)interdire les constructeurs inutiles
no-useless-rename (pas utilisé)interdire de renommer les affectations d'importation, d'exportation et déstructurées avec le même nom
no-varnécessite let ou const au lieu de var
prefer-constnécessitent des déclarations const pour les variables qui ne sont jamais réaffectées après avoir été déclarées