React routing not working while manually changing URL | React-router 4

Question

My Routing is working perfectly when URL is changed through Link component of React-router. However, if I try to change URL manually in browser, it hits 404 Error.

Below

Answer 1

This worked for me:

  var historyApiFallback = require('connect-history-api-fallback');

  gulp.task('connect', function() {
    connect.server({
      root: ['dist'],
      port: config.port,
      base: config.devBaseUrl,
      livereload: true,
      middleware: function(connect, opt) {
        return [
          historyApiFallback({})
        ]
      }
    });
  });

Thanks to @Shubham Khatri and @LinJI for all the help !