ionic-framework
Ionic - Analysez votre application avec jshint et gulp-jshint dans le cadre de votre processus de construction

Android Angular 2 AngularJS Cordova CSS HTML ionic2 iOS JavaScript TypeScript

Remarques

Linting votre application ionique avant de courir a d'énormes avantages. Il analysera le code pour détecter les erreurs potentielles et vous fera gagner énormément de temps.

Qu'est-ce que le linting et comment installer les paquets requis?

"Linting est le processus d’exécution d’un programme qui analysera le code pour détecter les erreurs potentielles." - voir Qu'est-ce que "Linting"?

Votre application ionique est livrée avec un fichier package.json. Accédez à la racine de votre application dans une ligne de commande / terminal et installez les packages suivants:

npm install jshint --save-dev
npm install jshint-stylish --save-dev
npm install gulp-jshint --save-dev

Ajouter une tâche Gulp

Dans la racine de votre application ionique, il y a un fichier gulpfile.js. Ouvrez-le dans un éditeur et collez la tâche gulp suivante:

gulp.task('lint', function() {
    return gulp.src(['./www/js/**/*.js']) 
        .pipe(jshint('.jshintrc'))
        .pipe(jshint.reporter('jshint-stylish')) 
        .pipe(jshint.reporter('fail'))
});

Ceci recherche un dossier appelé "js" dans le dossier "www". Si vous avez d'autres dossiers contenant des fichiers JavaScript, ajoutez-les également. Par exemple, ajoutons également un dossier appelé «vues»:

gulp.task('lint', function() {
    return gulp.src(['./www/js/**/*.js','./www/views/**/*.js'])
        .pipe(jshint('.jshintrc'))
        .pipe(jshint.reporter('jshint-stylish')) 
        .pipe(jshint.reporter('fail'))
});

Explications:

1) /**/*.js - This syntax means to look at all the js files in the subfolders too
2) .jshintrc - This is a configuration file that we will create in the next example.

Créer un fichier .jshintrc (facultatif)

Créez un fichier nommé ".jshintrc" dans la racine de votre application, où package.json est.

* Remarque sur Windows: créez un fichier nommé "jshintrc.txt". Puis renommez-le en ".jshintrc". (remarquez le point à la fin).

Ceci est un fichier de configuration. Il peut par exemple dire à jshint d'ignorer certaines variables et bien d'autres choses. Voici le mien:

{
    "predef": [ 
        "window",
        "console",
        "cordova",
        "device",
        "alert",
        "document",
        "debug",
        "setServiceVars",
        "StatusBar",
        "config"
    ],
    "globals": {
        "angular"        : false,
        "myApp"            : false,
        "myControllers"    : false,
        "myDirectives"    : false,
        "localStorage"     : false,
        "navigator"         : false, 
        "emit"             : false, 
        "atob"             : false,  
        "moment"        : false,
        "btoa"            : false
    },
    "node"          : true
}

Ajouter Makefile

Créez un fichier nommé: "Makefile" (sans extension) dans la racine de votre application
Ouvrez-le dans un éditeur de texte et ajoutez ceci:

android:
    gulp lint
    gulp sass
    ionic run android --device

ios:
    gulp lint
    gulp sass
    ionic build ios

Cela va charrier votre application et si cela passe, elle compilera sass et créera votre application.

Utilisation: Pour exécuter votre application, au lieu du programme "ionic run android --device", exécutez ces commandes:

Android: make android
iOS    : make ios

Modified text is an extract of the original Stack Overflow Documentation

Sous licence CC BY-SA 3.0

Non affilié à Stack Overflow