Skip to main content

AngularJs App With Yeoman, Grunt And Bower

Saurabh Dhariwal

Saurabh Dhariwal

AngularJs app with Yeoman
Grunt /
AngularJs app with Yeoman

To uninstall a package simply use.

AngularJs app with Yeoman

This command will produce result like:

AngularJs app with Yeoman

This command also remove this package from bower_components folder and entry from bower.js as well.

When we run $ yo angular earlier in this codelab the generator scaffolded a test directory in the root of the mytodo folder, created a karma.conf.js file, and pulled in the Node modules for Karma. We’ll be editing a Jasmine script to describe our tests soon but let’s see how we can run tests first. The AngularJS generator has two included test frameworks: ngScenario and Jasmine.

Grunt as a task runner can do most of that mundane work with our zero effort. The less work you have to do when performing repetitive tasks like minification, compilation, unit testing, linting, etc, the easier our job becomes. But all after we configured it through a Gruntfile.

Grunt runs on top of the Node.js platform and is distributed through the npm repository. It comes as two different tools grunt-cli which is the Grunt Command-line interface & grunt module. grunt-cli is installed globally while grunt is installed on a per-project basis.

SO grunt-cli need to installed globally:

AngularJs app with Yeoman

And after that we need to route into our AngularJS app and use Grunt and execute.

AngularJs app with Yeoman

I ended up installing all grunt dependencies manually.

AngularJs app with Yeoman

Note: you can install all of the dependencies in the photo above in one go with npm install.

Finally I ran the grunt command and it worked!

Run $ grunt test, you'll see some warnings in the Yeoman console. Don’t worry, that’s to be expected right now since our tests are currently failing for two reasons. Let's fix that.

AngularJs app with Yeoman

This command will result: 

AngularJs app with Yeoman