4 avg. rating (80% score) - 1 votes
Do you like to switch your career? Here's our recommendation on the important things to need to prepare for the job interview to achieve your career goals in an easy way. Grunt is the tool that runs automatically to compile, unit test and for lint. All the commands are written in a file and is executed using command-line interface. It is easy to learn and implement. Demand to this technology is increasing every day. There is huge demand for jobs related to Grunt anywhere. One can check the availability of the job across cities including Mumbai, Delhi, Bangalore, Pune and Hyderabad. It is a permanent job. Follow Wisdomjobs page for Grunt job interview questions and answers page to get through your job interview successfully.
Grunt has become very popular and has tons of plugins to choose from. These plugins are great assets for any app to automate various things with minimum efforts.
Grunt and Grunt plugins are installed and managed via npm, the Node.js package manager. To install grunt, first ensure the npm is installed properly. And then run following command.
Please note, --save-dev is optional.
Once installed, you need to add 2 files to setup Grunt.
1. package.json: This file is used by npm to store metadata for projects published as npm modules. So basically, there will be list of all Grunt plugins, along with grunt which your project is using.
2. Gruntfile: This file is named Gruntfile.js and is used to configure or define tasks and load Grunt plugins.
As mentioned in previous answer that “package.json” file holds the metadata for grunt plugins. So when grunt is installed using --save-dev option, the metadata is added to package.json. So you don’t have to add it manually. And this is how your package.json will look like,
Before will look at the difference, it is important to understand the difference between dependencies and devDependencies.
devDependencies are for the development-related scripts, e.g. unit testing, packaging scripts, documentation generation, etc. where dependencies are required for production use, and assumed required for dev as well. As for example, you can include some plugin which you require during development like (for debugging or unit testing) but you don’t need them on production.
So --save adds packages under dependencies and --save-dev adds under devdependencies section.
In the simplest terms, the tilde matches the most recent minor version (the middle number). ~1.2.3 will match all 1.2.x versions but will miss 1.3.0. The caret, on the other hand, is more relaxed. It will update you to the most recent major version (the first number). ^1.2.3 will match any 1.x.x release including 1.3.0, but will hold off on 2.0.0.
You can also define the exact version number that you wish to use like “1.3.5” or to always use latest version, simply use latest or *.
Grunt modules are distributed through Node’s NPM directory. Normally, they are prefixed with grunt- and official grunt plugins are prefixed with grunt-contrib. Example: grunt-contrib-uglify. You can get list of all grunt plugins here.
The syntax remains name but the only thing which changes is module/plugin name.
For example, to install uglify plugin:
By default, it always installs the latest version available. But if you wish to install specific version then same you can include in the command.
Run following command to uninstall grunt.
And if you wish to remove it from package.json, then use --save-dev option.
Grunt cli is command line interface to run grunt commands. In other words, it’s a tool to access Grunt from command line anywhere in the system. To install, grunt –cli execute following command
npm install -g grunt-cli
This will put the grunt command in your system path, allowing it to be run from any directory. Please note, that installing grunt-cli, doesn’t install grunt on your system.
-g means global which means it adds to PATH variables of the system so that you can run grunt from anywhere (without going to specific folder on command prompt).
The reason for having two components is to ensure that we can run different grunt versions side-by-side (i.e. legacy versions in older projects). Hence it is recommended to install grunt-cli globally while grunt should be installed on a per-project basis.
Task configuration is specified in your Gruntfile via the grunt.initConfig method. Inside of grunt.initConfig(), we read the information from package.json and saved it to a pkg property. With this, we can use the attributes from our package.json file. We can call the name of our project using pkg.name and the version with pkg.version.
Grunt plugin configuration needs to be defined within grunt.initConfig method. See below sample code.
Above code configures concat and uglify tasks.
Yes, we can override. Inside a task configuration, an options property may be specified to override built-in defaults. In addition, each target may have an options property which is specific to that target.
Tasks are grunt’s bread and butter. Every time Grunt is run, you specify one or more tasks to run, which tells Grunt what you’d like it to do. See below code.
Here, there are 2 tasks defined concat and uglify. And for each task, we defined targets. For concat, there are 2 targets “development” and “production” and only “development” for uglify. Creating target allows us to define separate settings for different objectives. Here, we can have different option for development and production version. It’s not compulsory to define a target.
Target’s can also have their own option parameters which will override the settings of options defined for the task.
You can execute the grunt task from command line. Remember, we have grunt command line interface. To execute contact module with grunt for all the tasks.
To execute task with particular target
grunt.loadNpmTasks() is used for loading grunt plugins. Before loading, please ensure that these plugins are already installed via npm.
Every grunt module may have defined a task. But running them individually can make things difficult for developers. What is one wants to run grunt uglify and grunt jshint together
Using grunt.registerTask(taskName, [description, ] taskList) we can group all the tasks under one roof. Task name can be anything of your choice, description is optional and task list is array of module tasks which you wish to execute. For example,
grunt.registerTask('development', ['jshint:development', 'concat:development', 'uglify:development']);
Above code creates a task named “development” and is asked to execute development target of “jshint”, “concat” and “uglify” packages. Similarly, you can register another task for production version.
grunt.registerTask('production', ['jshint:production', 'concat:production', 'uglify:production']);
Remember, you always need to define a default task.
grunt.registerTask('default', ['jshint', 'uglify', 'concat']);
Now, when you enter grunt on command prompt, it will execute the default task.
Use the --stack option to see stack traces. Such as grunt task –stack.
Though there are tons of plugins which you can use, but below are the most used.
Below is a sample gruntfile.js for your reference.
Grunt Related Tutorials
|HTML 5 Tutorial||AJAX Tutorial|
|Angular 2 Tutorial||ReactJS Tutorial|
|JAVA Persistence API (JPA) Tutorial|
Grunt Related Interview Questions
|HTML 5 Interview Questions||AJAX Interview Questions|
|Angular JS Interview Questions||Bootstrap Interview Questions|
|Angular 2 Interview Questions||ReactJS Interview Questions|
|jQuery Mobile Interview Questions||Advanced jQuery Interview Questions|
|Bootstrap3 Interview Questions|
All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd
Wisdomjobs.com is one of the best job search sites in India.