app.config.globalProperties - 无法读取未定义的属性“globalProperties”

Question

我正在尝试注册全局过滤器，Vue3但它引发了此错误：

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

根据Vue3 中的 Use 过滤器，但无法读取 globalProperties它应该可以工作。

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)
    }
}

你知道问题出在哪里吗？

Answer 1

您应该将根实例与根组件分开：

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")