gruntjsDémarrer avec gruntjs


Remarques

Cette section fournit une vue d'ensemble de ce qu'est gruntjs et pourquoi un développeur peut vouloir l'utiliser.

Il devrait également mentionner tous les grands sujets dans gruntjs, et établir un lien avec les sujets connexes. La documentation de gruntjs étant nouvelle, vous devrez peut-être créer des versions initiales de ces rubriques connexes.

Versions

Version Date de sortie
0.3.0 2012-07-30
0.4.0 2013-02-17
0.4.1 2013-03-12
0.4.2 2013-11-20
0.4.3 2014-03-06
0.4.4 2014-03-13
0.4.5 2014-05-11
1.0.0 2016-04-04
1.0.1 2016-04-05

Aidez-moi

Exécutez grunt -h pour voir ce qui suit:

  • Paramètres de ligne de commande
  • Toutes les tâches autonomes disponibles dans le Gruntfile du répertoire en cours
  • Toutes les sous-tâches de chaque suite de tâches dans le Gruntfile du répertoire en cours

Installer Grunt

Prerequesites

Grunt nécessite que Node.js et npm soient installés. Si Node.js et / ou npm ne sont pas installés sur votre ordinateur, accédez à https://nodejs.org et téléchargez le programme d'installation ou le package correspondant à votre système d'exploitation.

Première installation

Si vous installez Grunt pour la première fois, vous devez d'abord installer le package d'interface de ligne de commande Grunt grunt-cli globalement.

npm install -g grunt-cli

Cela installe l'interface de ligne de commande pour Grunt globalement afin que vous puissiez exécuter la version locale de Grunt dans votre projet.

Vous pouvez vérifier que le package grunt-cli installé en exécutant la commande suivante:

grunt --version
 

Cela devrait imprimer au moins la version actuelle de votre paquet grunt-cli .

Installer Grunt dans votre projet

Après avoir installé grunt-cli , vous pouvez installer le runner de tâche grunt et votre premier paquet Grunt grunt-contrib-jshint :

npm install grunt --save-dev
npm install grunt-contrib-jshint --save-dev

Cela télécharge les packages à partir du gestionnaire de packages NPM et les enregistre en tant que devDependencies dans votre fichier package.json .

Gruntfile

Ensuite, vous avez besoin d'un Gruntfile.js dans la racine de votre projet qui agit comme un fichier de configuration pour les tâches Grunt:

module.exports = function(grunt) {

    grunt.initConfig({
        jshint: {
            files: ['Gruntfile.js'],
        }
    });

    grunt.loadNpmTasks('grunt-contrib-jshint');


    grunt.registerTask('default', ['jshint']);
};

Ce fichier fait trois choses:

  1. Il dit à Grunt de charger la tâche grunt-contrib-jshint partir du paquet NPM
  2. Il conseille la tâche jshint à exécuter sur le fichier Gruntfile.js
  3. Il crée une tâche Grunt nommée default qui exécute la tâche jshint

Courir grunt

Après avoir configuré votre projet, vous pouvez exécuter la tâche default de Grunt en appelant:

grunt

Cela déclenche grunt-cli qui exécute le grunt local qui recherche une tâche Grunt nommée default qui est configurée pour exécuter la tâche appelée jshint .

Tâches en cours

Tâches en configuration

Tous les attributs de grunt.initConfig sont des tâches valides, donc si votre Gruntfile ressemble à ceci:

module.exports = function(grunt) {

    grunt.initConfig({
        jshint: {
            files: ['Gruntfile.js'],
        }
    });

    grunt.loadNpmTasks('grunt-contrib-jshint');


    grunt.registerTask('default', ['jshint']);
};
 

La commande shell $ grunt jshint exécutera la tâche jshint .

Tâches avec des cibles

Les tâches peuvent avoir des cibles différentes. Prenez cet extrait de code par exemple:

    grunt.initConfig({
        jshint: {
            gruntfile: {
                files: ['Gruntfile.js']
            },
            project: {
                files: 'src/**/*.js'
            }
        }
    });
 

Ici, jshint peut cibler le fichier gruntfile ou tous les fichiers JavaScript de votre projet. Si nous $ grunt jshint deux cibles seront utilisées, mais si nous $ grunt jshint:gruntfile le linter ne sera appliqué qu'au fichier grunt.

Tâches enregistrées

Les tâches par défaut enregistrées comme ceci grunt.registerTask('default', ['jshint']); s'exécutera avec la commande shell $ grunt .

Les nouvelles tâches enregistrées s'exécuteront en passant son nom comme argument de ligne de commande pour grogner. Par exemple:

grunt.registerTask('gruntfile', ['jshint:gruntfile']);
 

Va se lancer avec $ grunt gruntfile .