Simple file server - ngbp/ngbp GitHub Wiki

You may find it convenient to run a simple server during development. Here are two different ways this can easily be done:

Option #1

If you have python installed (it comes pre-installed on Mac and most Linux systems) you can run this command (do it inside the ngbp folder):

python -m SimpleHTTPServer 8080

This serves files on port 8080.

In another terminal run the command grunt watch, then go to http://localhost:8080/build/ and you can make code changes and see them in the browser.

Option #2

Integrate grunt-express into your grunt tasks. The instructions below will cause 'grunt watch' to start a basic express server that makes your Angular application accessible at http://localhost:9000/index.html.

This plugin requires Grunt ~0.4.0. First install grunt-express to your project by running the following:

npm install grunt-express --save-dev

Make three additions to your Gruntfile.js file:

  1. Add the following towards the top where other loadNpmTasks are being done.
grunt.loadNpmTasks('grunt-express');
  1. Immediately after the 'index' task definition add the following:
express: {
  devServer: {
	  options: {
		  port: 9000,
		  hostname: 'localhost',
		  serverreload: false,
		  bases: ['build', 'mocks'], // FS add mocks directory
		  livereload: true
	  }
  }
},

There are other options available that you may want to look at in the grunt-express documentation.

  1. Then add the following after the "grunt.renameTask( 'watch', 'delta' );" line:
  grunt.registerTask( 'watch', [ 'build', 'karma:unit', 'express', 'delta' ] );

Now when you run

grunt watch

you can access your AngularJS application at http://localhost:9000/index.html.