Installing Dependencies

Now that we have a package.json file setup, we can start installing and saving our dependencies and dev dependencies to it.

Let's start with out main dependencies. Since we're going to be building an angular application, we'll need angular. Also, we can utilize the pre-packaged todomvc resources for css. Let's install these and save them:

$ npm install angular todomvc-app-css todomvc-common --save

Notice how we included the --save flag. This means that we want npm to save these dependencies to our package.json file. If you look at your package.json file now, it should have a new section, dependencies:

package.json

{
  "dependencies": {
    "angular": "^1.4.7",
    "todomvc-app-css": "^2.0.1",
    "todomvc-common": "^1.0.2"
  }
}

Let's add and commit this change.

$ git add package.json
$ git commit -m 'add dependencies'

Sweet, now let's install our dependencies that we'll need only at dev time.

$ npm install browserify grunt grunt-browserify grunt-contrib-connect grunt-contrib-watch grunt-ts grunt-tslint load-grunt-config load-grunt-tasks tsd tsify tslint typescript --save-dev

Ok, now go back into your package.json file. It should now have a devDependencies section. This is because we added the flag --save-dev which instructed npm to only install those dependencies under the devDependencies field.

package.json

{
  "dependencies": {
    "angular": "^1.4.7",
    "todomvc-app-css": "^2.0.1",
    "todomvc-common": "^1.0.2"
  },
  "devDependencies": {
    "browserify": "^12.0.1",
    "grunt": "^0.4.5",
    "grunt-browserify": "^4.0.1",
    "grunt-contrib-connect": "^0.11.2",
    "grunt-contrib-watch": "^0.6.1",
    "grunt-ts": "^5.1.0",
    "grunt-tslint": "^2.5.0",
    "load-grunt-config": "^0.19.0",
    "load-grunt-tasks": "^3.3.0",
    "tsd": "^0.6.5",
    "tsify": "^0.12.2",
    "tslint": "^2.5.1",
    "typescript": "^1.6.2"
  }
}

Great, let's add and commit these newly add dev dependencies.

$ git add package.json
$ git commit -m 'add devDependencies'

Awesome, let's move onto the next section where we will setup our grunt build!