Accessing IGDB.com API v3 with Vue CLI 3/axios using a proxy to avoid CORS issues

App.vue

<template>
  <div id="app"></div>
</template>

<script>
import axios from 'axios';

export default {
  mounted() {
    axios({
      url: "http://localhost:[PORT_NUMBER]/games",
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'user-key': '[API_KEY]'
      },
      data: 'fields name; limit 10;'
    })
    .then(response => {
      console.log(response.data);
    })
    .catch(err => {
      console.error(err);
    });
    
    // If you don't want to use axios (it's easier IMHO), 
    // you can use the Fetch API (https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch)
    // fetch('http://localhost:[PORT_NUMBER]/games', {
    //   method: 'POST',
    //   headers: {
    //     'Content-type': 'application/json',
    //     'user-key': '[API_KEY]',
    //   },
    //   body: 'fields name; limit 10;'
    // }).then(response => {
    //     return response.json();
    // }).then(data => {
    //     console.log(data);
    // }).catch(err => {
    //     console.error(err);
    // });
  }
}
</script>

vue.config.js

// You'll need to create this file in the root of the project (outside `src` directory)
// Vue CLI uses http-proxy-middleware (https://github.com/chimurai/http-proxy-middleware#options)
// These are the options that worked for me. YMMV.
module.exports = {
  devServer: {
    proxy: {
      '^/': {
        target: 'https://api-v3.igdb.com/',
        ws: false,
        changeOrigin: true
      }
    }
  }
}