Using webpack dev server, how to proxy everything except "/app", but including "/app/api"

Question

Using webpack dev server, I'd like to have a proxy that proxies everything to the server, except my app. Except that the api, which has an endpoint under my app, should be proxied:

• /myapp/api/** should be proxied
• /myapp/** should not be proxied (any
• /** should be proxied

The following setup does this using a bypass function, but can it be done declaratively, using a single context specification?

proxy: [
    {
        context: '/',
        bypass: function(req, res, options) {
            if (
                req.url.startsWith('/app') &&
                !req.url.startsWith('/app/api')
            ) {
                // console.log ("no proxy for local stuff");
                return false;
            }
            // console.log ("Proxy!")
        },
        // ...
    },
],

Answer 1

According to https://webpack.js.org/configuration/dev-server/#devserver-proxy webpack dev server uses http-proxy-middleware and at its documentation (https://github.com/chimurai/http-proxy-middleware#context-matching) you can use exclusion.

This should be working in your case:

proxy: [
    {
        context: ['**', '/myapp/api/**', '!/myapp/**'],
        // ...
    },
],