How to overcome the problem with proxy settings in create-react-app?

Question

React

Good afternoon.
To debug react, you need to access scripts on another server while using stubs in the form of json files.
I'm trying to set up a proxy
https://daveceddia.com/create-react-app-express-ba...
but from the address /test/img.png I get a standard one, like /test/img.png/# and there is no transition.
I looked in the module file
\node_modules\react-scripts\scripts\start.js
made output to the console

const proxyConfig = prepareProxy(proxySetting, paths.appPublic);
    console.log(proxyConfig);
    process.exit(1);

received this information

[ { target: 'http://192.168.220.129:80',
    logLevel: 'silent',
    context: [Function: context],
    onProxyReq: [Function: onProxyReq],
    onError: [Function],
    secure: false,
    changeOrigin: true,
    ws: true,
    xfwd: true } ]

this is my proxy
package.json

"scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  },
  "proxy": "http://192.168.220.129:80",

What could be the problem?

Answer 1

Went into components
\node_modules\webpack-dev-server\lib\Server.js
uses

const getProxyMiddleware = (proxyConfig) => {
          const context = proxyConfig.context || proxyConfig.path;

          // It is possible to use the `bypass` method without a `target`.
          // However, the proxy middleware has no use in this case, and will fail to instantiate.
          if(proxyConfig.target) {
            return httpProxyMiddleware(context, proxyConfig);
          }
        }

if I explicitly set the path
app.use('/api', httpProxyMiddleware({target: proxyConfig.target, changeOrigin: true}));
everything works
Most likely the webpack-dev-server module did not correctly prepare data for context and proxyConfig
This is not here anymore.