Skip to content

Application configuration

Configuration belongs to the application instance, not process-level global state. Create the app first, and then write the configuration before mounting:

ts
import { createApp } from "@elfui/core";
import { App } from "./App";

const app = createApp(App);

app.config.globalProperties.appName = "Console";
app.config.warnHandler = (message, ...args) => {
  console.warn("[Console]", message, ...args);
};
app.config.errorHandler = (error, info) => {
  reportError(error, { info });
};

app.mount("#app");

Configuration items

OptionsFunction
globalPropertiesApplication-level read-only convention value; component setup reads from ctx.config.globalProperties and template reads from $app
warnHandlerReceive runtime warnings for this App component
errorHandlerReceive setup/render error for this App

When you need to read the configuration in TypeScript logic in the macro component, use useAppConfig():

ts
import { useAppConfig } from "@elfui/core";

const appName = useAppConfig().globalProperties.appName;

Template string expressions still respect TypeScript scoping; pure template expressions read $app:

ts
defineHtml(`<p>{{ $app.appName }}</p>`);

globalProperties itself is not a reactive container. When runtime updates are required, put the return value of useRef() or useReactive() into it.

boundary

tagPrefix does not belong to application configuration. The macro component tag is determined at compile time, and the unified prefix can only be set in @elfui/vite-plugin.

WARNING

@elfui/core also exports configure() and getConfig() for legacy process-wide configuration and low-level integrations. New applications should prefer isolated app.config; resetConfig() remains available only from @elfui/runtime, primarily for test cleanup.