My app is a Vue 2 front end app that load a configuration file since it is a generic front end and each client has its own configuration file. The configuration is a Yaml file that is loaded when the application starts. The configuration file has properties like:

urlBtn: https://www.youtube.com/

This is my main.js:

import Vue from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
import axios from "axios";
import Vuelidate from "vuelidate";
import yaml from "js-yaml";
import fs from "fs";
import { BootstrapVue } from "bootstrap-vue";
import {
  BIcon,
  BIconChevronDoubleDown,
  BIconChevronDoubleUp,
  BIconEyeFill,
  BIconEyeSlashFill
} from "bootstrap-vue";

import "bootstrap/dist/css/bootstrap.css";
import "bootstrap-vue/dist/bootstrap-vue.css";

Vue.use(Vuelidate);
Vue.use(BootstrapVue);
Vue.component("BIcon", BIcon);
Vue.component("BIconChevronDoubleDown", BIconChevronDoubleDown);
Vue.component("BIconChevronDoubleUp", BIconChevronDoubleUp);
Vue.component("BIconEyeFill", BIconEyeFill);
Vue.component("BIconEyeSlashFill", BIconEyeSlashFill);

Vue.prototype.$axios = axios; 
Vue.config.productionTip = false;


export const app = new Vue({
  data() {
    return {
      ebaConfig: null,
      publicPath: process.env.BASE_URL
    };
  },
  methods: {
    async loadEbaConfig() {
      const config = await axios.get(`${this.publicPath}config.yaml`);
      const doc = yaml.load(config.data);
      this.ebaConfig = doc;
    }
  },
  router,
  store,
  created() {
    this.loadEbaConfig();
  },
  render: h => h(App)
}).$mount("#app");

When i try to access the ebaConfig property in a the mounted life hook of another component, it's null. Example:

mounted() {    
    if (this.$root.ebaConfig.urlBtn.trim()) {
      this.showCecomaWebBtn = true;
    }
  }

In the example above, I get the error:

[Vue warn]: Error in mounted hook: "TypeError: Cannot read properties of null (reading 'urlBtn')"

found in

---> <App> at src/App.vue
        <root>

I don't understand why it happens since the property load is executed in the created lifecycle. Therefore it should be available to the other components in the mounted lifecycle. How can I solve that? What am I doing wrong?

Note: The config file is a valid yaml file since everything works correctly when I use that property in a normal way, that is, outside of the life cycles. It seems that, despite being in the created life cycle, the data is loaded at the end of the complete loading of the application.