Q:

Vue.js app is run on http://localhost:8080, whenever I make a GET request using axios to my back-end API, the localhost gets prepended to the URL

I have set axios's base URL to be a variable from my .env file like this:
axios.defaults.baseURL = process.env.VUE_APP_SERVER_API

And this is the .env variable VUE_APP_SERVER_API="http://lolapi.example.com/api"
Whenever I make a GET request like this:
axios.get('/' + action + 'Summoner/' + trimmedSummoner)

The request goes to the wrong URL. It tries to GET from this URL:
http://localhost:8080/summoner/lolapi.example.com/api/getSummoner/TheOnyxKing
instead of this one:
http://lolapi.example.com/api/getSummoner/TheOnyxKing

If I hardcode the correct URL in the GET request, everything works fine:
axios.get('http://lolapi.kabzamalov.com/api/getSummoner/TheOnyxKing')

Any clue why is this happening? Also this doesn't happen if I build the Vue.js project, it only happens during development.

A:

If this is a vue-cli app, try setting publicPath or baseUrl in your production and/or development environment.
https://cli.vuejs.org/config/#publicpath

