This is very important for a website to respond quickly and effectively. For this, we make websites in different technologies but what stops us from making it fast and good at the response is its third party tools, libraries, JavaScript and other tools that are heavy enough to load fast.
In AngularJS technology we make the whole website or any product totally on the code that is smart enough to respond in quick time but still there are some of the components that lag behind the loading time of its libraries and dependencies.
There is one tool that makes it easy for you to manage all your files in a best-optimized way and that is known as GRUNT.
Grunt serve
[/et_pb_text][et_pb_text admin_label=”Text” background_layout=”light” text_orientation=”justified” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]
A brief introduction of GRUNT is that it is a JavaScript task runner which is mainly used for JavaScript objects as a command line tool. It is a task runner that is written on top of Node.JS.
[/et_pb_text][et_pb_text admin_label=”Text” background_layout=”light” text_orientation=”justified” use_border_color=”off” border_color=”#ffffff” border_style=”solid”]
Why is GRUNT AngularJS useful?
1. Grunt can easily perform the repetitive tasks that are needed in a project. For example compilation, minifying files, doing unit testing and much more.
2. It has built in tasks that actually extend the functionality of the plugins and the scripts that we use.
3. It can automate things with very fewer efforts to make.
How can Grunt be Used?
There is a way to use GRUNT in your project and that is by installing Grunt’s command line interface (CLI) globally. The command to install GRUNT CLI is –
npm install -g grunt-cli
This will simply put the grunt command in the system path, which makes it run from any directory.
There are two project files that are essential to run the project-
1. package.json
2. Gruntfile.js
Package.json :
It is placed in the root directory of the project and is used to run the listed dependencies whenever the command npm install is run in the same folder.
Package.json file will look something like this –
{
“name”: “habilelabs”,
“version”: “0.1.1”,
“Dependencies”: {
“grunt-ng-annotate”: “~0.10.0”,
“grunt-jscs”: “~1.8.0”,
“grunt-newer”: “~1.1.0”
}
}
Gruntfile.js :
It is the default place from where all the configuration settings will go for grunt.
The basic structure of this file looks like this –
// all configuration goes inside this function
module.exports = function(grunt) {
// CONFIGURE GRUNT
grunt.initConfig({
// get the configuration info from package.json file
// this way we can use things like name and version (pkg.name)
pkg: grunt.file.readJSON(‘package.json’),
// all of our configuration goes here
});
// Load the plugin that provides the “uglify” task
If you have any query in Grunt AngularJS topic then ask in comment box. We are best Web Development company and provides Support and services.
Hope you enjoy the post, so don’t forget to share with friends.
Grunt serve
[/et_pb_text][/et_pb_column][/et_pb_row][/et_pb_section]
