React setupProxy.js for different environments

Viewed 241

I am very new to react but my issue is really around strategies for deploying my app to different environments (dev, QA, UAT). My react app makes an api call and I am using a setupProxy.js to define the url for that api, works great locally. I have also built the api and it is hosted separately. My question is how do I change the setupProxy.js so that the url respects the environment it's deployed to. Right now I'm using AzureDevops and Octopus for building and deploying. It seems like everything gets compiled so trying to change this file after is built won't work. Just looking to see what your deployment strategies are.

Here is my setupProxy.js

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


const baseUri = 'http://localhost:5000/api';


const proxy = {
    target: baseUri + '/UsageRequest/ScreenScrapeErrors',
    changeOrigin: true
}

const proxy2 = {
    target: 'https://www.stackoverflow.com',
    changeOrigin: true,
}

module.exports = function (app) {
    app.use(
        '/SceenScrapeErrors',
        createProxyMiddleware(proxy)
    );


    app.use(
        '/jobs',
        createProxyMiddleware(proxy2)
    );
};

I would like to modify the baseUri variable as it's getting deployed to the different environments.

1 Answers
Related