title: Setting up Django and Webpack on dev server using api subdirectory
body: <p><strong>Context:</strong></p>
  
  <p>I'm using Django as a backend and Vue/Vuetify as a separate frontend.  I use Apache to serve the frontend and Django is strictly for api calls in a client/server setup.</p>
  
  <p>I've set up WSGIScriptAlias to serve from [base_url]/api  instead of the site root. I deployed the project and it's serving django request/repsonses from /api as expected.</p>
  
  <p>In my dev environment, I am running 2 concurrent dev servers.  I'm running the webpack dev server (port 10000) for the frontend project, and the django runserver on a separate port (10001) to service my requests when developing.</p>
  
  <p>in webpack I've set up the following:</p>
  
  <pre><code>devServer:{
          hot: true,
          port: 10000
          historyApiFallback: true,    
          host: 'localhost',
          //django api
          proxy:{
              '/api': {
                  target: 'http://localhost:10001',
                  pathRewrite: {'^/api' : ''},
                  secure: false
              }
          }
      }
  </code></pre>
  
  <p>The idea here is that any time I request something from <a href="http://localhost:10000/api" rel="nofollow noreferrer">http://localhost:10000/api</a> then it will redirect automatically to localhost:10001, which mimics how the production instance works since production cuts off the /api portion of the request.</p>
  
  <p><strong>Problem:</strong></p>
  
  <p>When I run the dev webpack and django server, I can successfully request localhost:10000/api and get a django response, but I noticed that when I attempt to access <a href="http://localhost:10000/api/admin" rel="nofollow noreferrer">http://localhost:10000/api/admin</a>, which should bring up the django admin page, Django redirects to <a href="http://localhost:10000/admin" rel="nofollow noreferrer">http://localhost:10000/admin</a>.</p>
  
  <p>I'm looking for a way outside of WSGIScriptAlias (since I can't use that in my dev instance unless I set up a local apache / virtualhost which I've experienced has refresh issues when django is modified).</p>
  
  <p>Is there a way I could do one of the following?</p>
  
  <p>A) in production not have WSGIScriptAlias / Django in production drop the /api portion of the request (which would make url patterns consistent across all environments)</p>
  
  <p>B) possibly set up a Base URL in Django Settings or runserver to include /api so that it doesn't try to redirect without the /api</p>
  
  <p>C) perhaps something in webpack that I'm missing for the devserver setup?</p>
  
  <p><strong>Full Disclosure:</strong>
  There is another question that asks something <em>similar</em> (<a href="https://stackoverflow.com/questions/17420478/how-to-set-base-url-in-django">How to set base URL in Django</a>) but is different because it looks like they are talking about production, i'm talking about a dev instance.  Their solution was also to use WSGIScriptAlias which I can't use. </p>