Vue 3: Uncaught TypeError: Cannot read properties of undefined (reading 'default')

I have a cryptic error that I cannot figure out.

I have created an es modules that exports a reactive object:

appHttpHeaders module:

import { reactive } from "@vue/reactivity";
import { computed } from "vue";

import { appSession, appContext } from "@/store/reactives";

let appHttpHeaders = reactive({
    'Accept': 'application/json',
    'Content-Type': 'application/json;charset=UTF-8',
    'brand': computed(() => appContext.brand),
    'X-Auth-Token': computed(() => appSession.authenticationToken),
    'Accept-Language': computed(() => appContext.locale === 'fr' ? 'fr_CA,fr;q=0.8' : 'en_CA,en;q=0.8')

export default appHttpHeaders;
})

Which is imported / exported in an index.js file:

import appHttpHeaders from '@/store/reactives/appHttpHeaders'
export {
    
    appHttpHeaders,
    
}

Which is imported in my axios api file:

import { appHttpHeaders } from '@/store/reactives'

I am receiving the following error:

exception.js:10 Uncaught TypeError: Cannot read properties of undefined (reading 'default')
    at Module.appHttpHeaders (exception.js:10:1)
    at ./src/api/applicationsApi.js (applicationsApi.js:16:20)
    at __webpack_require__ (bootstrap:24:1)

I am stumped. Hopefully someone here could shed some light?

Thanks