[Vuejs]-What is the best way to get a Vue app to correctly read the env variables that have been set on Heroku?

by

0👍

✅

Using ENV variables in Vue CLI (or Webpack build app in general) is done using Webpack DefinePlugin which replaces the values like process.env.VUE_APP_XXX in your code at build time

So if you define (or change) your variables directly in Heroku dashboard instead of .env file committed to repo, you need to rebuild you app on Heroku to pick up the changes…

If you are using ENV to configure any secrets (API keys etc), don’t !! These values will be included directly in JS bundle of your app and easily accessible to anyone…

0👍

You can use heroku cli to set your env variables – documentation

$ heroku config:set DATABASE_URI=database_uri_here
$ heroku config:set SESSION_SECRET=session_secret
... and so on for each variable,

OR

if you have the env variables set in your .env file then you can do this as well

heroku config:set $(cat .env | sed '/^$/d; /#[[:print:]]*$/d')

Leave a comment