title: Webpack Dev Server React Subfolder Not Working
body: <p>I have a webpack dev server that I want to server from a folder. Example url would be:</p>
  
  <p>localhost/app</p>
  
  <p>I have in my webpack config:</p>
  
  <pre><code>devServer: {
      hot: true,
      contentBase: path.resolve(__dirname, "dist"),
      port: 3002,
      host: "0.0.0.0",
      publicPath: "/app",
      historyApiFallback: true,
      disableHostCheck: true
  },
  output: {
      path: path.join(__dirname, "dist"),
      publicPath: "/app/",
      filename: "app.[hash].js"
  }
  </code></pre>
  
  <p>This works fine. I can load up my app by going to localhost/app. But since I am using react I want to use a router, and when I go to a route under that subfolder I get an error:</p>
  
  <pre><code>Cannot GET /app/user
  </code></pre>
  
  <p>If I change everything back to server from / then the routing works. I would like to serve from a folder and have routing work still with webpack dev server, but I am not sure if that is possible.</p>
  
  <p>Here is my app and routes.</p>
  
  <pre><code>import React from "react";
  import { render } from "react-dom";
  import { AppContainer } from "react-hot-loader";
  import { BrowserRouter } from 'react-router-dom';
  
  import App from "./components/App";
  
  const renderApp = Component =&gt; {
      render(
          &lt;AppContainer&gt;
              &lt;BrowserRouter basename="/app"&gt;
                  &lt;App /&gt;
              &lt;/BrowserRouter&gt;
          &lt;/AppContainer&gt;,
          document.getElementById("root")
      );
  };
  
  renderApp(App);
  
  if (module.hot) {
      module.hot.accept(() =&gt; renderApp(App));
  }
  </code></pre>
  
  <p>App.js</p>
  
  <pre><code>import React, { Component } from "react";
  import { Route } from 'react-router-dom';
  import Login from './Login';
  
  export default class App extends Component {
      render() {
          return (
              &lt;div&gt;
                  &lt;Route exact path="/" component={Login}/&gt;
                  &lt;Route exact path="/user" component={Login}/&gt;
              &lt;/div&gt;
          );
      }
  }
  </code></pre>
  
  <p>I am new to webpack and have searched around to get sub folders to work and they all say that is how it supposed to work.</p>
  
  <p>Any ideas?</p>
  
  <p>Thanks</p>
  
  <hr>
  
  <p>I got it to work by changing:</p>
  
  <pre><code>historyApiFallback: {
    index: '/app',
  }
  </code></pre>