Add centralized error handler for sync Vue app

This commit is contained in:
Eli Ribble 2026-05-08 23:33:49 +00:00
parent da90401b2d
commit 01f35b603e
No known key found for this signature in database
3 changed files with 83 additions and 1 deletions

View file

@ -4,6 +4,7 @@ import App from "@/AppSync.vue";
import * as config from "@/config";
import router from "@/route/config";
import * as sentry from "@/sentry";
import { useErrorHandler } from "@/composable/error-handler";
import "maplibre-gl/dist/maplibre-gl.css";
@ -18,8 +19,24 @@ import "@/gen/custom-icons.scss";
import * as bootstrap from "bootstrap";
window.bootstrap = bootstrap;
const { setError } = useErrorHandler();
const pinia = createPinia();
const app = createApp(App);
app.config.errorHandler = (err, instance, info) => {
// err: the error object
// instance: the component instance where error occurred
// info: Vue-specific error info, e.g., lifecycle hook
console.error("Global error:", err);
console.error("Error info:", info);
console.error("Error instance:", instance);
// You could dispatch to a store, send to error tracking service, etc.
// For example, trigger a global error state
setError(err);
};
app.use(pinia);
app.use(router);
sentry.Init(app, pinia).then(() => {