CODEWITHSUNDEEP
javascriptvue.jsvuejs3
Milano
Milano

Reputation: 18735

app.config.globalProperties - Cannot read property 'globalProperties' of undefined

I'm trying to register global filter in Vue3 but it raises this error:

main.js?56d7:13 Uncaught TypeError: Cannot read property 'globalProperties' of undefined

According to the Use filter in Vue3 but can't read globalProperties it should work.

import { createApp } from "vue";
import App from "./App.vue";
import router from "./router";
import store from "./store";
import "./assets/tailwind.css";
import axiosSetUp from "@/auth/axiosSetUp";
import {formatIsoDateTime as utils_formatIsoDateTime} from "@/utils";

axiosSetUp()
const app = createApp(App).use(store).use(router).mount("#app");


app.config.globalProperties.$filters = {
    formatIsoDateTime(isoString) {
        return utils_formatIsoDateTime(isoString)
    }
}

Do you know where the problem is?

Upvotes: 5

Views: 5951

Answers (1)

Boussadjra Brahim
Boussadjra Brahim

Reputation: 1

You should separate the root instance from the root component :

const app = createApp(App).use(store).use(router);

//use the root instance to add your config
app.config.globalProperties.$filters = {
    formatIsoDateTime(isoString) {
        return utils_formatIsoDateTime(isoString)
    }
}
// then you could mount it 
app.mount("#app")

Upvotes: 7

Related Questions