title: React Router Throwing Warning: Location "/" did not match any routes
body: <p>I am trying to create a simple application that really doesn't do anything.  I am having a hard time right off the bat with react router.</p>
  
  <p>The version of react router I am using is 1.0</p>
  
  <p>I keep getting an error that says</p>
  
  <p><strong>Warning: Location "/" did not match any routes</strong></p>
  
  <p>Below is my code</p>
  
  <p><strong>Main.js</strong></p>
  
  <pre><code>import React from "react";
  import ReactDOM from "react-dom";
  import { IndexRoute, Router, Route, Link } from 'react-router'
  import createHistory from 'history/lib/createBrowserHistory';
  import Template from './modules/template'
  import Index from './modules/index'
  import NotFound from './modules/notfound'
  
  let history = new createHistory();
  
  var routes = (
      &lt;Router history={history}&gt;
          &lt;Route path="/" component={Template}&gt;
              &lt;IndexRoute component={Index}/&gt;
              &lt;Route path="*" component={NotFound}/&gt;
          &lt;/Route&gt;
      &lt;/Router&gt;
  );
  
  ReactDOM.render(routes, document.getElementById('glass-app'));
  </code></pre>
  
  <p><strong>Index.js</strong></p>
  
  <pre><code>import React from "react";
  import RouteHandler from 'react-router';
  
   export default class Index extends React.Component{
    render(){
      return &lt;div&gt;Hello World!&lt;/div&gt;
   }
  }
  </code></pre>
  
  <p><strong>Template.js</strong></p>
  
  <pre><code>import React from "react";
  import RouteHandler from 'react-router';
  
  export default class Template extends React.Component{
   render(){
      return  &lt;div&gt;
                  &lt;div&gt;My Header&lt;/div&gt;
                  &lt;RouteHandler/&gt;
              &lt;/div&gt;
   }
  }
  </code></pre>
  
  <p><strong>NotFound.js</strong></p>
  
  <pre><code>import React from "react";
  import RouteHandler from 'react-router';
  
  export default class NotFound extends React.Component{
    render(){
       return  &lt;div&gt;
          The Page You Were Looking For Can't Be Found
       &lt;/div&gt;
    }
  }
  </code></pre>
  
  <p><strong>WebPack Config</strong></p>
  
  <pre><code>var webpack = require('webpack');
  module.exports = {
      entry : {
          javascript :  "./public/js/main.js",
          html : "./public/index.html"
      },
      output : {
          path : __dirname + '/dist',
          filename : 'bundle.js'
      },
      devtool: 'inline-source-map',
      devServer:{
          historyApiFallback: true
      },
      plugins: [
          new webpack.HotModuleReplacementPlugin()
      ],
      module : {
          loaders : [
              {test: /\.jsx?$/, loaders: ['react-hot', 'babel'], exclude: /node_modules/},
              {test : /\.html$/, exclude: /node_modules/, loader : 'file?name=[name].[ext]'}
          ]
      }
  };
  </code></pre>
  
  <p>I have read many posts with similar suggestions but no luck.  Any help would be appreciated. </p>