Webpack-dev-server config to route API calls from react-router to node/express router

Question

I have a client react/redux application that needs to gather data from my node express with express router.

On development environment we use webpack-dev-server, that does not route the /api calls to the express/node. So we need to configure a proxy on devserver.

Here is the configuration:

  devServer: {
      proxy: { 
        '/api/*': 'http://localhost:8080'
      }    

Every /api/whatever/whatever or api/whatever call must be redirected to node/express.

I´m getting the following error on webpack console:

[HPM] Error occurred while trying to proxy request /api/admin/user from localhost:8080 to http://localhost:8080 (ENOBUFS) (https://nodejs.org/api/errors.html#errors_common_system_errors)

Questions:

• What does ENOBUFS means in the error code ?
• Shall I need to configure a different port or a different node/express service to serve the API ?
• How do I configure the proxy to call the express/router APIs ?

Answer 1

server.js

app.get("/api/data", (req, res) => {
  res.send("hi from server"); // replace me with real data
});

webpack.config

//need the ^ before your path name
proxy: {
      "^/api/*": {
        target: "http://localhost:3001/api/",
        secure: false
      }
    }