This seems dumb, but I have it setup like this:

in config/index.js:

module.exports = {

    API_LOCATION: 'http://localhost:8080/api/'

}

then in src/app.js I have:

import Vue from 'vue'

import VueRouter from 'vue-router'

import VueResource from 'vue-resource';



Vue.use(VueRouter);

Vue.use(VueResource);



const App = require(./app.vue);

const home = require(./components/home.vue);

const config = require('../config');

window.config = config;

Then in src/components/home.vue, I have a script block that uses it like so:

<script>

    module.exports = {

        data: function() {

            return {

                obj: null

            }

        },

        created: function() {

            this.$http.get(config.API_LOCAITON + '/call').then(res => {

                // Do some business

            }, res => {

                // Handle some error

            });

        }

    }

</script>

This works but it strikes me as a bad idea to use window to handle an application configuration. What's the more canonical approach here?