Переменные окружения Vue.js не работают с axios в Heroku

Question

Я развернул приложение Vue.js на heroku API, также размещенном на heroku.

Приложение VueJS использует axios для подключения к API.Я установил переменную конфигурации в heroku:

VUE_APP_ROOT_API = https://[my -express-api] .herokuapp.com / api

Вот мой базовый вызов axios:

import axios from 'axios'
const token = localStorage.getItem('token')

export default () => {
  console.log(process.env.VUE_APP_ROOT_API)
  return axios.create({
    baseURL: process.env.VUE_APP_ROOT_API,
    headers: {
      'Content-Type': 'application/json',
      token: token,
    },
    validateStatus: function () {
      return true;
    }
  })
}

Однако журнал консоли показывает, что переменная не определена, и axios использует URL-адрес приложения Vue в качестве базы для вызовов API (https://[my -vue-app] .herokuapp.com/ undefined / ) вместо того, который указан в переменной config.