title: How to set url in vue for a external backend api and a devserver api
body: <p>I'm setting up an app using Vue, and want to create an API Service where on production should point to api.domain.com.br and on dev should point to 127.0.0.1:1337.</p>
  
  <p>My API is using axios to make requests like so:</p>
  
  <pre><code>axios.post('/api/v2/plan', plan)
  </code></pre>
  
  <p>My vue.config.js has a this proxy solution:</p>
  
  <pre><code>  devServer: {
      proxy: {
        '/api': {
          target: 'http://127.0.0.1:1337',
          ws: true,
          changeOrigin: true
        },
      }
    },
  </code></pre>
  
  <p>I could create a service from axios and import it on api:</p>
  
  <pre><code>import axios from 'axios';
  
  
  const client = axios.create({
    baseURL: 'https://api.domain.com.br'
  });
  
  
  export default client;
  </code></pre>
  
  <p>But then it wont work with dev proxy set on vue.config.js</p>
  
  <p><strong>synthesis:</strong></p>
  
  <p>App on production is at app.domain.com.br</p>
  
  <p>Api on production is at api.domain.com.br</p>
  
  <p>App on dev is at 127.0.0.1:8080</p>
  
  <p>Api on dev is at 127.0.0.1:1337</p>
  
  <p>When i build this app, it should use api.domain.com.br on axios calls.</p>