Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

vue js how "process.env" variables in index.html

I am trying to use env variables in my html markup to change env variables according to whether I am in production or development mode .. So for context using mixpanel I have two projects one for development and one for production with different api keys. how would I use webpack to do this, accessing my process.env.VUE_APP_MIXPANEL env variable in my html ?

like image 518
okandas Avatar asked Sep 18 '18 08:09

okandas


1 Answers

If you are using the default Webpack template you can access the .env variables in index.html using this syntax (for example):

<html>
  <head>
    <title><%= VUE_APP_TITLE %></title>
  </head>
  <body>
    ...
  </body>
</html>

Obviously you need to have a variable like this

VUE_APP_TITLE=My title

in your .env file

like image 190
matteogll Avatar answered Oct 08 '22 05:10

matteogll