Adapter sa qualité de code en fonction d'EcmaScript

Je pense qu'il est inutile que je vous parle d'EcmaScript 6 (ou ES6 / ES2015). Si vous voulez en savoir plus, je vous laisse aller sur le site de pony.foo, mais en gros, c'est une évolution majeure de l'évolution de la syntaxe, et avec les nouvelles versions, nous aurons des évolutions majeures de plus en plus récurrentes.

Du coup, notre code JavaScript et NodeJs évoluent ! Et dans le cas de NodeJs, nous pouvons estimer que c'est la version 0.12.X qui a apporté un lot de fonctionnalités ES6, et la version 4.X.X qui apporte la quasi-totalité de la norme ES6 (et la version en cours de développement, la 5.X.X, comblera le manque en apportant les évolutions de ES7 / ES2016).

Je ne vais pas entrer dans les détails des améliorations, mais le code (et la façon de coder à fortiori) va changer. Du coup, si vous utilisez des outils de qualité de code comme moi, il faut les paramétrer de nouveau.

Prenons le cas d'Eslint. Ce dernier a le bout goût d'être hautement paramétrable et de supporter des plugins pour étendre la vérification.


Pour l'installer:

> npm install --save-dev --save-exact eslint



Voyons maintenant le contenu (rapide) du fichier ".eslintrc":

{
    "parser": "espree",
    "env": {
        "browser": false,
        "node": true,
        "amd": false,
        "mocha": false,
        "jasmine": false
    },
    "globals": {
        "__dirname": true,
        "module": true,
        "require": true,
        "process": true,
        "Buffer": true
    },
    "rules": {
        "no-alert": 1,
        "no-array-constructor": 2,
        "no-bitwise": 0,
        "no-caller": 2,
        "no-catch-shadow": 2,
        "no-comma-dangle": 0,
       
        // Nearly 150 others properties !
        // ...
    }
}


Que voyons-nous ? que nous pouvous déclarer des variables globales, que nous pouvons préciser à la fois le parser à utiliser, mais aussi l'environnement, et enfin les règles de validations.

Jusqu'à présent, quand je décidai de partir sur un projet en ES6 (donc avec Node 4.X.X), je modifais le contenu comme suite:

{
    "parser": "espree",
    "env": {
        "browser": false,
        "node": true,
        "amd": false,
        "mocha": false,
        "jasmine": false
    },
    "globals": {
        "__dirname": true,
        "module": true,
        "require": true,
        "process": true,
        "Buffer": true,
        "Promise": true
    },
    "ecmaFeatures": {
        "arrowFunctions": true,
        "binaryLiterals": true,
        "blockBindings": true,
        "classes": true,
        "defaultParams": false,
        "destructuring": true,
        "forOf": true,
        "globalReturn": true,
        "generators": true,
        "jsx": false,
        "modules": true,
        "objectLiteralComputedProperties": true,
        "objectLiteralDuplicateProperties": true,
        "objectLiteralShorthandMethods": true,
        "objectLiteralShorthandProperties": true,
        "octalLiterals": true,
        "regexUFlag": true,
        "regexYFlag": true,
        "spread": false,
        "superInFunctions": true,
        "templateStrings": true,
        "unicodeCodePointEscapes": true
    },
    "rules": {
        "no-alert": 1,
        "no-array-constructor": 2,
        "no-bitwise": 0,
        "no-caller": 2,
        "no-catch-shadow": 2,
        "no-comma-dangle": 0,
        
        // Nearly 150 others properties !
        // ...
    }
}


Que voyons-nous ? D'abord, j'ai ajouté dans les "globals" la variable "Promise". Ensuite, j'ai ajouté une nouvelle section "ecmaFeatures" prévu par Eslint afin d'activer ou non les features.

Quel est le problème avec cette approche ? C'est que nous devons tout simplement savoir les fonctionnalités de vérification d'Eslint (qui ne cesse de s'enrichir), mais aussi bien connaître ce qu'apporte les différentes versions de NodeJs. Par exemple NodeJs 4.X.X ne supporte pas le JSX, ni les paramètres par défaut, si les "spread parameters".

Pour cela, nous allons utiliser un petit plugin Eslint sympa: eslint-config-features.

Le principe est simple: comme nous devons spécifier dans le fichier "package.json" avec quelle version de NodeJs nous devons travailler. Pour ça, nous devons spécifier la section "engines":

{
  "name": "my-project",
  "version": "0.0.1",
  "main": "./lib/index.js",
  "files": [
    "lib",
    "resources"
  ],
  "author": "Julien Roche",
  "license": "ISC",
  "engines": {
    "node": ">=4.0.0",
    "npm": ">=2.0.0"
  },
  "dependencies": {
    "body-parser": "1.14.2",
    "express": "4.13.4",
    "request": "2.69.0"
  }
}


Dans l'exemple ci-dessus, je précise bien que je travaille avec une verison à minima NodeJs 4.X.X. Et le but de ce plugin est de configurer Eslint en se basant là-dessus !


Pour installer le plugin:

> npm install --save-dev --save-exact eslint-config-features


Ensuite, il suffit de modifier soit modifier le fichier "package.json" en ajoutant ce qui suit: comme suit:

"eslintConfig": {
    "extends": [
      "features"
    ]
}


Soit de modifier le fichier ".eslintrc" comme suit:

{
    "parser": "espree",
    "env": {
        "browser": false,
        "node": true,
        "amd": false,
        "mocha": false,
        "jasmine": false
    },
    "globals": {
        "__dirname": true,
        "module": true,
        "require": true,
        "process": true,
        "Buffer": true,
        "Promise": true
    },
    "extends": "eslint-config-features",
    "rules": {
        "no-alert": 1,
        "no-array-constructor": 2,
        "no-bitwise": 0,
        "no-caller": 2,
        "no-catch-shadow": 2,
        "no-comma-dangle": 0,
        
        // Nearly 150 others properties !
        // ...
    }
}


Et voilà le travail !

Commentaires

Enregistrer un commentaire

Posts les plus consultés de ce blog

ISO: liens & outils utiles

Image
Voici quelques normes ISO à connaître et que vous aurez à faire face dans vos développements. Et quelques liens / outils permettant de s'assurer que nous faisons correctement leurs intégrations Code Pays https://countrycode.org/ est super site qui permet de lister les pays du monde avec leur country code (en mode number et iso): Et par pays, nous pouvons avoir des informations supplémentaires, comme le format téléphone, la position géographique, la time zone, la monnaie, etc: Ce site du coup regroupe les country code: En ISO 3166 name (où un nom est attribué à un pays) En ISO 3166 numeric (où un chiffre numérique est attribué à un pays) En ISO 3166-1 alpha-2 (code en 2 alpha majuscule) En ISO 3166-1 alpha-3 (code en 3 alpha majuscule) Ainsi que les langues. Tout cela est d'ailleurs regroupés dans ce fichier téléchargeable . Code langue / locale Là, nous tombons dans un des plus grands soucis d'un développeur: co...
Lire la suite

NodeJs et SSL: une petite analyse

Le but de cet article est de faire un petit tour d'horizon de l'usage de SSL dans nos applications NodeJs, en l'occurence, quand nous souhaitons faire une application Web, une API REST, ou les deux. Nous allons avoir 6 étapes pour de réalisation d'un serveur NodeJs, avec à chaque fois 12 clients: Un client NodeJs sans certificats SSL - strictSSL à false Un client NodeJs sans certificats SSL - strictSSL à true Un client NodeJs avec un certificat SSL client non fiable - strictSSL à false Un client NodeJs avec un certificat SSL client non fiable - strictSSL à true Un client NodeJs avec un certificat SSL server non fiable - strictSSL à false Un client NodeJs avec un certificat SSL server non fiable - strictSSL à true Un client NodeJs avec un certificat SSL client fiable - strictSSL à false Un client NodeJs avec un certificat SSL client fiable - strictSSL à true Un client NodeJs avec un certificat SSL serveur fiable - strictSSL à false...
Lire la suite

Créer sa commande slack en quelques minutes

Image
Le but de cet article est de vous montrer que très simplement, nous pouvons créer une commande personnalisée pour Slack. Ici, nous allons afficher des chats :)" Tout d'abord, nous allons nous créer des comptes sur: Slack:  https://slack.com Heroku:  http://www.heroku.com/ qui permettra d'héberger notre service REST pour Slack Gitlab: https://gitlab.com  qui permet évidemment d'héberger notre code, mais qui pourra de manière automatiser déployer notre application sur Heroku à chaque commit (et cela, même en mode "gratuit") Concentrons-nous tout d'abord sur Heroku et Gitlab. Créons un compte Heroku. Une fois cela fait, aller dans votre compte :. Vous verrez alors une section nommée "API key": Cliquez sur "Reveal" pour voir la valeur et conservez la bien en mémoire. Ensuite, sur en retournant sur votre dashboard d'applications Heroku , cliquez sur "New" et créez une nouvelle application. Dans...
Lire la suite