ASP CORE and webpack in VS2019: how to configure IIS Express to proxy js/css requests to webpack devserver?

Question

Code like this

<link rel="stylesheet" href="~/dist/vendor.css" asp-append-version="true" />
<link rel="stylesheet" href="~/dist/main.css" asp-append-version="true" />

started on IIS Express requests the files using IIS Express port, when I need return those files from webpack devserver that works on another port.

There is an article how to "switch" configurations and "put" required port to <link> and <script> references, but here should be much more easy to instruct IIS Express (or self hosted ASP Core app) to proxy requests for css and js .

Unfortunatly this doesn't work (has no effect):

<system.net>
    <defaultProxy>
      <proxy
        proxyaddress="http://localhost:55510"
        bypassonlocal="false"
      />
      <!--<bypasslist>
        <add address="^((?!\/dist\/).)*$" />
      </bypasslist>-->
    </defaultProxy>
  </system.net>

How to configure IISEXpress or (selfhosted app) to proxy requests for /dist/*.js and /dist/*.css to the webpack devserver ?

PS It seems those developers who are working with VS+webpack/devserver prefer to configure webpack devserver to proxy requests for html/json/images/fonts to IISExpress (solving the same way but from another end). Why?

Answer 1

"Just write the middleware that do the proxy"

solves it.

I have create nuget package for it: DashboardCode.AspNetCore.Http

GitHub: https://github.com/DashboardCode/AspNetCore

First add this to the Startup.cs

using DashboardCode.AspNetCore.Http;

Then add this to Startup.ConfigureServices() :

serviceCollection.AddSingleton( new DevProxyMiddlewareSettings(new PathString("/dist"), new Uri("http://localhost:55555")));

Then add this to the Startup.Configure:

app.UseMiddleware<DevProxyMiddleware>();

After this all GET requests like http://localhost:xxxx/dist/sample.js will be redirected to the http://localhost:55555/dist/sample.js

What is nice, it works for both cases: self-hosted and IISExpress hosted application.