LiveReload ASP.net MVC web app with Grunt

Question

Is it possible in grunt to watch files and automatically reload a ASP.net MVC web application. Or does livereload only work with files served through grunt. I have come across grunt plugin 'grunt-iisexpress' but not really sure if I can use it, in conjunction with tasks to reload a ASP.net MVC webapp when a file has changed.

I do not have any index.html as a starting page in my web app but _ViewStart.cshtml which kicks off the whole application.

Answer 1

It is possible. I just got live-reloading in my ASP.NET app using grunt-contrib-watch (https://github.com/gruntjs/grunt-contrib-watch). It only took a few minutes.

I used this article as a guide: http://www.aliirz.com/javascript/2013/12/25/Live-Reload-with-Grunt/.

Do this via a command prompt in the ASP.NET app's folder.

1. Install grunt-contrib-watch

If you don't yet have a package.json file and want to save your dependencies in one:

npm init

Then add Grunt and grunt-contrib-watch to your project:

npm install --save-dev  grunt grunt-contrib-watch

2. Configure Grunt

Next create a Gruntfile.js in that same folder. Here's mine:

  'use strict';
  module.exports = function (grunt) {
    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.initConfig({
      watch: {
        views: {
          files: [
              'Views/**/*.cshtml', 
              'Scripts/**/*.js',
              'Content/**/*.css',
              'Content/images/**/*',            
              'bin/**/*.dll'
          ],
          options: {
            livereload: true,
          }
        }
      }
    });
  }

3. Run live reload server

Run your live-reload server alongside your ASP.NET app:

grunt watch

4. Add Snippet to ASP.NET

Finally, to enable it in your ASP.NET app, simply add the live-reload snippet to your Layouts and/or Views:

<script src="http://localhost:35729/livereload.js"></script>