Create an AngularJS project with Yeoman

By | March 16, 2015

Hello, in this post I will explain how to set up an AngularJS project with Firebase. For this I will use Yeoman. This utility will allow us to create the skeleton of our application and Configure Grunt to make our life easier.

To start we need to install Yeoman:

npm install -g yo 

Then the generator angularfire:

npm install -g generator-angularfire 

Then we start the generator:

yo angularfire foo

Enter the name of your Firebase url and follow the instructions. Now we have to change some code in Gruntfile.js. Indeed, by default launch the command :

grunt serve

will clean up any files you add between <! – bower -> and <! – endBower ->. This is due to the wiredep task that will normally include our bower components automatically. For this to work properly just add the attribute “dependency: true” in the app section of the wiredep task.

    wiredep: {
        options: {
            directory : 'bower_components',
            cwd: ''
        },
        app: {
            src: ['<%= yeoman.app %>/index.html'],
            dependency : true,
            ignorePath:  /\.\.\//
       }
    }

Now run your server and enjoy the power of Angular and Firebase with Grunt.

00

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.