Как использовать подстановку переменных в приложениях Frontend js, таких как серверные приложения?

Я пытаюсь найти элегантное решение чего-то действительно простого. Я работаю над приложением React, используя приложение create-response-app, и пытаюсь найти простой способ заменить переменные (например, адрес API) при развертывании кода в различных средах, например, в Azure.

До сих пор я использовал файлы .env и .env.production для хранения переменных, которые отлично работают, пока у нас есть только одна среда. Но поскольку я планирую использовать всего три среды (тестовая, qa и производственная), мне нужно найти лучшее решение.

Один из подходов - заменить переменные на этапе сборки npm нашей сборки CI. Этот подход будет работать, но переменные вводятся в пакет, поэтому эта сборка не работает для других сред, и мы не заинтересованы в создании одной сборки для каждой среды.

Я пытался использовать параметры приложения в Azure и создавать свои собственные переменные среды, но эти переменные просто недоступны с использованием process.env в моем коде React.

Есть ли способ легко ввести эти переменные при выпуске Интернета? В качестве альтернативы мы можем как-то настроить их в Azure или у другого поставщика? Или есть другое решение?