How to install grunt and how to build a script with it

Question

Hi, I am trying to install Grunt on Windows 7 64 bit. I installed Grunt with commands

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

but now, if I try to do grunt init , it causes me an error -

Could not find a valid Grunt file. See the Getting Started Guide for more information on how to configure grunt: http://gruntjs.com/getting-started Fatal Error: Cannot find Gruntfile.

But when I look in the grunt folder on my system, there is Gruntfile.js . can someone please advise me how to correctly install this grunt and how to write a built Script using grunt. I have one page of HTML and java Script, if I want to build Script using Grunt, how can I do this?

Answer 1

Follow these steps to configure GruntJS:

• Make sure you install your package.json or install a new one:

   npm init 

• Install Grunt CLI as Global:

   npm install -g grunt-cli 

• Install Grunt in your local project:

   npm install grunt --save-dev 

• Install any Grunt module that you may need during the build process. Just for the sake of this sample, I will add the Concat module to merge files together:

   npm install grunt-contrib-concat --save-dev 

• Now you need to configure Gruntfile.js , which will describe your build process. For this example, I simply merge the two JS files file1.js and file2.js in the js folder and generate 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']); }; 

• Now you will be ready to start the build process by running the following command:

   grunt 

Hope this gives you an idea of ​​how to work with the GruntJS build.

NOTE:

You can use grunt-init to create Gruntfile.js if you want to create based on the wizard instead of the raw coding for step 5.

To do this, follow these steps:

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

For Windows users: if you use cmd.exe, you need to change ~/.grunt-init/gruntfile to %USERPROFILE%\.grunt-init\ . PowerShell correctly recognizes ~ .

Answer 2

For some time we need to set the PATH variable for WINDOWS

% USERPROFILE% \ AppData \ Roaming \ NPM

After this test with where grunt

Note. Remember to close the command prompt window and open it again.

Answer 3

I have the same problem, but I decided to change it from Grunt.js to Gruntfile.js Check the file name before entering grunt.cmd in windows cmd (if you use windows).

Answer 4

You must install grunt-cli in the devDependencies of the project and then run it through the script in your package.json. Thus, other developers working on the project will use the same version of grunt, and they will also not have to install globally as part of the installation.

Install grunt-cli with npm i -D grunt-cli instead of installing it globally with -g .

 //package.json ... "scripts": { "build": "grunt" } 

Then use npm run build to fire.