Update SpaProxy to work with http-proxy-middleware 2.x.

Is there an existing issue for this?

• I have searched the existing issues

Is your feature request related to a problem? Please describe the problem.

When updating http-proxy-middleware from the default installed version of 0.19.1 to the latest version 2.0.4, the SpaProxy stops working. 0.21.0 is the last version that still works. It never detects that the proxy is ready even though the JS compilation is complete.

Describe the solution you’d like

SpaProxy to work with the latest version of http-proxy-middleware.

Additional context

AspNet output:

info: Microsoft.Hosting.Lifetime[14]
      Now listening on: https://localhost:7286
info: Microsoft.Hosting.Lifetime[14]
      Now listening on: http://localhost:5286
info: Microsoft.Hosting.Lifetime[0]
      Application started. Press Ctrl+C to shut down.
info: Microsoft.Hosting.Lifetime[0]
      Hosting environment: Development
info: Microsoft.Hosting.Lifetime[0]
      Content root path: C:\Users\narsh\Projects\AspNetCore6React\AspNetCore6React\
info: Microsoft.AspNetCore.SpaProxy.SpaProxyLaunchManager[0]
      No SPA development server running at https://localhost:44494 found.
info: Microsoft.AspNetCore.SpaProxy.SpaProxyMiddleware[0]
      SPA proxy is not ready. Returning temporary landing page.
info: Microsoft.AspNetCore.SpaProxy.SpaProxyMiddleware[0]
      SPA proxy is not ready. Returning temporary landing page.
info: Microsoft.AspNetCore.SpaProxy.SpaProxyMiddleware[0]
      SPA proxy is not ready. Returning temporary landing page.
info: Microsoft.AspNetCore.SpaProxy.SpaProxyMiddleware[0]
      SPA proxy is not ready. Returning temporary landing page.
info: Microsoft.AspNetCore.SpaProxy.SpaProxyMiddleware[0]
      SPA proxy is not ready. Returning temporary landing page.
info: Microsoft.AspNetCore.SpaProxy.SpaProxyMiddleware[0]
      SPA proxy is not ready. Returning temporary landing page.

Proxy output:

> aspnetcore6react@0.1.0 prestart
> node aspnetcore-https && node aspnetcore-react


> aspnetcore6react@0.1.0 start
> rimraf ./build && react-scripts start
Starting the development server...

(node:22244) [DEP_WEBPACK_DEV_SERVER_HTTPS] DeprecationWarning: 'https' option is deprecated. Please use the 'server' option.
(Use `node --trace-deprecation ...` to show where the warning was created)
(node:22244) [DEP_WEBPACK_DEV_SERVER_ON_AFTER_SETUP_MIDDLEWARE] DeprecationWarning: 'onAfterSetupMiddleware' option is deprecated. Please use the 'setupMiddlewares' option.
(node:22244) [DEP_WEBPACK_DEV_SERVER_ON_BEFORE_SETUP_MIDDLEWARE] DeprecationWarning: 'onBeforeSetupMiddleware' option is deprecated. Please use the 'setupMiddlewares' option.
Compiled with warnings.

src\App.js
  Line 11:26:  'App' was used before it was defined  no-use-before-define

src\components\Counter.js
  Line 4:24:  'Counter' was used before it was defined  no-use-before-define

src\components\FetchData.js
  Line 4:24:  'FetchData' was used before it was defined  no-use-before-define

src\components\Home.js
  Line 4:24:  'Home' was used before it was defined  no-use-before-define

src\components\Layout.js
  Line 6:24:  'Layout' was used before it was defined  no-use-before-define

src\components\NavMenu.js
  Line 7:24:  'NavMenu' was used before it was defined  no-use-before-define

Search for the keywords to learn more about each warning.
To ignore, add // eslint-disable-next-line to the line before.

assets by path static/js/*.js 2.52 MiB
  asset static/js/bundle.js 2.52 MiB [emitted] (name: main) 1 related asset
  asset static/js/node_modules_web-vitals_dist_web-vitals_es5_min_js.chunk.js 5.37 KiB [emitted] 1 related asset
asset index.html 1.62 KiB [emitted]
asset asset-manifest.json 490 bytes [emitted]
orphan modules 355 KiB [orphan] 125 modules
runtime modules 31.4 KiB 15 modules
javascript modules 2.31 MiB
  modules by path ./node_modules/ 2.27 MiB 145 modules
  modules by path ./src/ 42.6 KiB
    modules by path ./src/components/ 27 KiB 7 modules
    modules by path ./src/*.js 11.8 KiB 4 modules
    modules by path ./src/*.css 3.85 KiB 2 modules
asset modules 4.4 KiB
  data:image/svg+xml,%3csvg xmlns=%27.. 281 bytes [built] [code generated]
  data:image/svg+xml,%3csvg xmlns=%27.. 279 bytes [built] [code generated]
  data:image/svg+xml,%3csvg xmlns=%27.. 161 bytes [built] [code generated]
  data:image/svg+xml,%3csvg xmlns=%27.. 271 bytes [built] [code generated]
  data:image/svg+xml,%3csvg xmlns=%27.. 181 bytes [built] [code generated]
  + 11 modules

WARNING in src\App.js
  Line 11:26:  'App' was used before it was defined  no-use-before-define

src\components\Counter.js
  Line 4:24:  'Counter' was used before it was defined  no-use-before-define

src\components\FetchData.js
  Line 4:24:  'FetchData' was used before it was defined  no-use-before-define

src\components\Home.js
  Line 4:24:  'Home' was used before it was defined  no-use-before-define

src\components\Layout.js
  Line 6:24:  'Layout' was used before it was defined  no-use-before-define

src\components\NavMenu.js
  Line 7:24:  'NavMenu' was used before it was defined  no-use-before-define

webpack 5.70.0 compiled with 1 warning in 14524 ms

[JoshClose]

The fix is to change

const createProxyMiddleware = require("http-proxy-middleware");

to

const { createProxyMiddleware } = require("http-proxy-middleware");

[Nickman87]

The fix is to change

const createProxyMiddleware = require("http-proxy-middleware");

to

const { createProxyMiddleware } = require("http-proxy-middleware");

Fixed all the issues, strange that this script does not give any error output anywhere! Thanks a lot @JoshClose