Gulp Serve: render index.html for all paths

Question

I'm running a simple AngularJS app, and serving it using Gulp / Gulp Serve with Browsersync.

To make my Angular routes work, I need to render /index.html for all paths on the port.

How do I do this? My current code is:

gulp.task('serve', ['less'], function() {

    browserSync.init({
        server: "./app"
    });

    gulp.watch("app/css/*.less", ['less']);
    gulp.watch("app/*.html").on('change', browserSync.reload);
    gulp.watch("app/js/**/*.js").on('change', browserSync.reload);
});

Answer 1

The solution was to use this middleware, the connect-history-api-fallback , like so:

gulp.task('serve', ['less'], function() {

    browserSync.init({
        server: {
          baseDir: "./app",
          middleware: [ history() ]
        }
    });
});

Works perfectly now!