Browserify with AngularJs router

Question

I have application in angularJs and it will have different modules with different JS files.for js file optimization I am going to implement Browserify .

My angularJs code is like this in app.js:

var app = angular.module("webapp", ['ngRoute']);

app.run(['$rootScope', '$state','$urlRouterProvider',
function ($rootScope,   $state,$urlRouterProvider) {
$urlRouterProvider.otherwise('/index.html');
$stateProvider
    .state('root.home',{
        url: '/index.html',
        views: {
            'header': {
                templateUrl: 'modules/header/html/header.html',
                controller: 'headerController'
            },          
            'content-area': {
                templateUrl: 'modules/home/html/home.html',
                controller: 'homeController'
            },
            'footer': {
                templateUrl: 'modules/common/html/footer.html',
                controller: 'footerController'
            }
        },
        data: {
            displayName: 'Home',
         }
    })
.state('root.about',{
        url: '/index.html',
        views: {
            'header': {
                templateUrl: 'modules/header/html/header.html',
                controller: 'headerController'
            },          
            'content-area': {
                templateUrl: 'modules/home/html/about.html',
                controller: 'aboutController'
            },
            'footer': {
                templateUrl: 'modules/common/html/footer.html',
                controller: 'footerController'
            }
        },
        data: {
            displayName: 'About',
         }
    })

  }]);

How can we implement Browserify for this code. Any one please suggest with an example.