web-dev-qa-db-fra.com

Comment installer grunt et comment construire un script avec

Bonjour, j'essaie d'installer Grunt sur Windows 7 64 bits. J'ai installé Grunt en utilisant des commandes

 npm install -g grunt
 npm install -g grunt-cli

mais maintenant, si j'essaie de faire grunt init, cela me jette une erreur -

Un fichier Gruntfile valide n'a pas pu être trouvé. Veuillez consulter le guide de démarrage pour plus d’informations sur la configuration de grunt: http://gruntjs.com/getting-started Erreur fatale: impossible de trouver le fichier Gruntfile.

Mais quand je regarde dans le dossier Grunt de mon système, le Gruntfile.js est là. Quelqu'un peut-il me guider s'il vous plaît comment installer ce grunt correctement et comment écrire un script construit en utilisant le grunt. J'ai une page HTML et un script Java si je veux créer un script à l'aide de Grunt, comment puis-je le faire?

76
Sau

Pour configurer la construction de GruntJS, voici les étapes:

  1. Assurez-vous d’avoir configuré votre package.json ou d’en créer un nouveau:

    npm init
    
  2. Installer Grunt CLI en tant que global:

    npm install -g grunt-cli
    
  3. Installez Grunt dans votre projet local:

    npm install grunt --save-dev
    
  4. Installez n'importe quel module Grunt dont vous pourriez avoir besoin dans votre processus de construction. Juste pour les besoins de cet exemple, je vais ajouter le module Concat permettant de combiner des fichiers:

    npm install grunt-contrib-concat --save-dev
    
  5. Vous devez maintenant configurer votre Gruntfile.js qui décrira votre processus de construction. Pour cet exemple, je combine simplement deux fichiers JS file1.js et file2.js dans le dossier js et génère app.js:

    module.exports = function(grunt) {
    
        // Project configuration.
        grunt.initConfig({
            concat: {
                "options": { "separator": ";" },
                "build": {
                    "src": ["js/file1.js", "js/file2.js"],
                    "dest": "js/app.js"
                }
            }
        });
    
        // Load required modules
        grunt.loadNpmTasks('grunt-contrib-concat');
    
        // Task definitions
        grunt.registerTask('default', ['concat']);
    };
    
  6. Maintenant, vous serez prêt à exécuter votre processus de construction en suivant la commande:

    grunt
    

J'espère que cela vous donnera une idée de la manière de travailler avec la construction GruntJS.

REMARQUE:

Vous pouvez utiliser grunt-init pour créer Gruntfile.js si vous souhaitez créer à l'aide d'un assistant plutôt que du code brut pour l'étape 5.

Pour ce faire, procédez comme suit:

npm install -g grunt-init
git clone https://github.com/gruntjs/grunt-init-gruntfile.git ~/.grunt-init/gruntfile
grunt-init gruntfile

Pour les utilisateurs Windows: Si vous utilisez cmd.exe, vous devez remplacer ~/.grunt-init/gruntfile par %USERPROFILE%\.grunt-init\. PowerShell reconnaîtra le ~ correctement.

209
Qorbani

Il faut un certain temps pour définir la variable PATH pour WINDOWS

% USERPROFILE%\AppData\Roaming\npm

Après ce test avec where grunt

Remarque: N'oubliez pas de fermer la fenêtre Invite de commandes et de la rouvrir.

6

J'ai le même problème, mais je l'ai résolu en changeant mon Grunt.js en Gruntfile.js. Vérifiez le nom de votre fichier avant de taper grunt.cmd sur windows cmd (si vous utilisez Windows).

5
andromada

Vous devriez installer grunt-cli sur les devDependencies du projet, puis l'exécuter via un script dans votre package.json. De cette manière, les autres développeurs travaillant sur le projet utiliseront tous la même version de grunt et ne devront pas non plus s'installer de manière globale dans le cadre de la configuration.

Installez grunt-cli avec npm i -D grunt-cli au lieu de l’installer globalement avec -g.

//package.json

...

"scripts": {
  "build": "grunt"
}

Ensuite, utilisez npm run build pour lancer le grognement.

0
itwasmattgregg