setupProxy.js in Create React App not working

Hello I am trying to get a dynamic proxy going in react and express. I do not want to configure the proxy in the package.json because I need it to be dynamic. I have tried the following using setupProxy.js by the CRA documentation. Here is my code

TypeError: Cannot read property 'split' of null
[1]     at required (/Users/chadlew/Desktop/SC.CRM.React/client/node_modules/requires-port/index.js:13:23)
[1]     at Object.common.setupOutgoing (/Users/chadlew/Desktop/SC.CRM.React/client/node_modules/http-proxy/lib/http-proxy/common.js:101:7)
[1]     at Array.stream (/Users/chadlew/Desktop/SC.CRM.React/client/node_modules/http-proxy/lib/http-proxy/passes/web-incoming.js:127:14)
[1]     at ProxyServer.<anonymous> (/Users/chadlew/Desktop/SC.CRM.React/client/node_modules/http-proxy/lib/http-proxy/index.js:81:21)
[1]     at HttpProxyMiddleware.middleware (/Users/chadlew/Desktop/SC.CRM.React/client/node_modules/http-proxy-middleware/dist/http-proxy-middleware.js:22:32)

This is the error I'm getting everytime.

And here is my code: setupProxy.js

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

module.exports = function(app) {
  app.use(
    '/api', // You can pass in an array too eg. ['/api', '/another/path']
    createProxyMiddleware({
      target: process.env.REACT_APP_PROXY_HOST,
      changeOrigin: true,
    })
  );
};

Here is the React:

import React, { useState, useEffect } from 'react'
import GoogleLogin from 'react-google-login';

const Login = ({history}) => {
    const [authData, setAuthData] = useState({});
    useEffect(() => {
        if(Object.keys(authData).length > 0) {
            (async () => {
                const res = await fetch("/api/auth/login", {
                    method: 'POST',
                    headers: {'Content-Type': 'application/json'},
                    body: JSON.stringify(authData)
                });
                // This data would be set into app level state (react-context api) and be accessible everywhere
                const { message, isAuth, userData } = await res.json();
            })();
        }
    }, [authData, history])

    const successHandler = data => {
        setAuthData(data);
        history.push("/home");
    }

    const failureHandler = (data) => setAuthData(data);

    return (
        <div className = "login-page">
            <h1 style = {{marginBottom: '1rem'}}>Welcome</h1>
            <GoogleLogin 
                clientId = {process.env.REACT_APP_GOOGLE_CLIENT_ID}
                buttonText = "Login with Google"
                onSuccess = {successHandler}
                onFailure = {failureHandler}
                cookiePolicy = {'single_host_origin'}
            />
        </div>
    )
}

export default Login;

Whenever I login with google I get the error message and the proxy ultimately does not work. Any suggestions would be highly appreciated