Task automation is critical for any AngularJS single-page application. Grunt gets the job done.
Hey guys, welcome to the Egghead IO series on grand builds for any other projects. I had a couple of reasons I wanted to do this series.
There are a lot of people just getting into Angular for the first time and a lot of people who are getting into Grunt for the first time.
We're going to start in a very simple place. We're going to start with a small Angular app that was written by my buddy, Dave Gettis.
The first steps in this series are going to be to install the necessary NPM packages.
Let's start by installing Grunt.
Prior to Grunt 0.4, you only installed Grunt once on a global level and that added Grunt to your path, so you could run it from any directory you're in. Starting with 0.4, going forward, there's two packages that we're going to need to install.
We'll start by installing global E, the Grunt command line and interface. We'll say, "NPM install-G Grunt CLI." This adds Grunt keyword to our path, so we can execute Grunt from whatever directory we want to on our computer.
The second command we'll run is NPM install Grunt, we'll use the "--" save dev flag, so that it adds our dependency into our package.json. The package.json is the file that NPM uses to stores its dependencies.
The next thing we'll need to do is create a Grunt file. Let's create a new job file called, "Gruntfile.js." The Gruntfile has three main pieces.
The first part is the part is the module.exports statement and then inside that, we've got the Grunt.initConfig statement and the Grunt registerTask statement.
In the following sections of this series, we're going to add new bits to the init.Config and to the registerTask statements. This will allow us to tell Grunt what to do and what order we want to do it in.
We're going to explore a few different coding styles that you can use when you're building projects with Angular.
By the end of this series, we're going to have a full-blown easily customizable Grunt build for our Angular project.