feat: 添加全局错误处理逻辑,优化 PrimeVue 插件导入和路由设置
This commit is contained in:
10
src/main.ts
10
src/main.ts
@ -20,6 +20,16 @@ async function init() {
|
|||||||
.use(createHead())
|
.use(createHead())
|
||||||
.use(createPinia().use(piniaPluginPersistedstate));
|
.use(createPinia().use(piniaPluginPersistedstate));
|
||||||
|
|
||||||
|
app.config.errorHandler = (error, instance, info) => {
|
||||||
|
console.error('Global error:', error);
|
||||||
|
console.error('Component:', instance);
|
||||||
|
console.error('Error Info:', info);
|
||||||
|
// 这里你可以:
|
||||||
|
// 1. 发送错误到日志服务
|
||||||
|
// 2. 显示全局错误提示
|
||||||
|
// 3. 进行错误分析和处理
|
||||||
|
};
|
||||||
|
|
||||||
setupVueI18n(app);
|
setupVueI18n(app);
|
||||||
setupPrimeVue(app);
|
setupPrimeVue(app);
|
||||||
setupRouter(app);
|
setupRouter(app);
|
||||||
|
@ -1,13 +1,19 @@
|
|||||||
/**
|
/**
|
||||||
* 需要把 <DynamicDialog /> <ConfirmDialog /> <Toast /> 放在 App.vue 的 template 中
|
* 需要把 <DynamicDialog /> <ConfirmDialog /> <Toast /> 放在 App.vue 的 template 中
|
||||||
*/
|
*/
|
||||||
|
import 'primeicons/primeicons.css';
|
||||||
import '../assets/reset-primevue.css';
|
import '../assets/reset-primevue.css';
|
||||||
|
|
||||||
|
import Aura from '@primevue/themes/aura';
|
||||||
|
import zhCN from 'primelocale/zh-CN.json';
|
||||||
|
import PrimeVue from 'primevue/config';
|
||||||
|
|
||||||
// ========================================================================
|
// ========================================================================
|
||||||
// ========================== ConfirmationService =========================
|
// ========================== ConfirmationService =========================
|
||||||
// ========================================================================
|
// ========================================================================
|
||||||
// @ts-expect-error - Ignore missing types
|
// @ts-expect-error - Ignore missing types
|
||||||
import ConfirmationEventBus from 'primevue/confirmationeventbus';
|
import ConfirmationEventBus from 'primevue/confirmationeventbus';
|
||||||
|
|
||||||
import type { ConfirmationOptions } from 'primevue/confirmationoptions';
|
import type { ConfirmationOptions } from 'primevue/confirmationoptions';
|
||||||
interface HConfirmationOptions extends ConfirmationOptions {
|
interface HConfirmationOptions extends ConfirmationOptions {
|
||||||
rejectProps?: import('primevue/button').ButtonProps;
|
rejectProps?: import('primevue/button').ButtonProps;
|
||||||
@ -27,6 +33,7 @@ const ConfirmationService = {
|
|||||||
// ========================================================================
|
// ========================================================================
|
||||||
// @ts-expect-error - Ignore missing types
|
// @ts-expect-error - Ignore missing types
|
||||||
import ToastEventBus from 'primevue/toasteventbus';
|
import ToastEventBus from 'primevue/toasteventbus';
|
||||||
|
|
||||||
import type { ToastServiceMethods } from 'primevue/toastservice';
|
import type { ToastServiceMethods } from 'primevue/toastservice';
|
||||||
// https://github.com/primefaces/primevue/blob/61929eae7526015af0362fc5889f2af7527403d1/packages/primevue/src/toastservice/ToastService.js
|
// https://github.com/primefaces/primevue/blob/61929eae7526015af0362fc5889f2af7527403d1/packages/primevue/src/toastservice/ToastService.js
|
||||||
const ToastService: ToastServiceMethods = {
|
const ToastService: ToastServiceMethods = {
|
||||||
@ -49,7 +56,9 @@ const ToastService: ToastServiceMethods = {
|
|||||||
// ========================================================================
|
// ========================================================================
|
||||||
// @ts-expect-error - Ignore missing types
|
// @ts-expect-error - Ignore missing types
|
||||||
import DynamicDialogEventBus from 'primevue/dynamicdialogeventbus';
|
import DynamicDialogEventBus from 'primevue/dynamicdialogeventbus';
|
||||||
|
|
||||||
import type { DialogServiceMethods } from 'primevue/dialogservice';
|
import type { DialogServiceMethods } from 'primevue/dialogservice';
|
||||||
|
|
||||||
// https://github.com/primefaces/primevue/blob/18367429f624285ff32d0ef775c1825a43a02fb1/packages/primevue/src/dialogservice/DialogService.js#L7
|
// https://github.com/primefaces/primevue/blob/18367429f624285ff32d0ef775c1825a43a02fb1/packages/primevue/src/dialogservice/DialogService.js#L7
|
||||||
const DialogService: DialogServiceMethods = {
|
const DialogService: DialogServiceMethods = {
|
||||||
open: (content, options) => {
|
open: (content, options) => {
|
||||||
@ -73,10 +82,6 @@ function useDialogRef() {
|
|||||||
return inject<DialogRef>('dialogRef');
|
return inject<DialogRef>('dialogRef');
|
||||||
}
|
}
|
||||||
|
|
||||||
import Aura from '@primevue/themes/aura';
|
|
||||||
import zhCN from 'primelocale/zh-CN.json';
|
|
||||||
import PrimeVue from 'primevue/config';
|
|
||||||
import 'primeicons/primeicons.css';
|
|
||||||
function setupPrimeVue(app: import('vue').App) {
|
function setupPrimeVue(app: import('vue').App) {
|
||||||
app.use(PrimeVue, {
|
app.use(PrimeVue, {
|
||||||
locale: {
|
locale: {
|
||||||
@ -94,10 +99,4 @@ function setupPrimeVue(app: import('vue').App) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
export {
|
export { ConfirmationService, DialogService, setupPrimeVue, ToastService, useDialogRef };
|
||||||
ConfirmationService,
|
|
||||||
ToastService,
|
|
||||||
DialogService,
|
|
||||||
useDialogRef,
|
|
||||||
setupPrimeVue, //
|
|
||||||
};
|
|
||||||
|
@ -3,7 +3,7 @@ import { createLogGuard, createProgressGuard, createStackGuard } from 'utils4u/v
|
|||||||
import { createRouter, createWebHistory } from 'vue-router';
|
import { createRouter, createWebHistory } from 'vue-router';
|
||||||
import { handleHotUpdate, routes } from 'vue-router/auto-routes';
|
import { handleHotUpdate, routes } from 'vue-router/auto-routes';
|
||||||
|
|
||||||
export const router = createRouter({
|
const router = createRouter({
|
||||||
history: createWebHistory(import.meta.env.BASE_URL),
|
history: createWebHistory(import.meta.env.BASE_URL),
|
||||||
routes,
|
routes,
|
||||||
strict: true,
|
strict: true,
|
||||||
@ -11,10 +11,11 @@ export const router = createRouter({
|
|||||||
router.onError((error) => {
|
router.onError((error) => {
|
||||||
console.debug('🚨 [router error]: ', error);
|
console.debug('🚨 [router error]: ', error);
|
||||||
});
|
});
|
||||||
|
|
||||||
if (import.meta.hot) handleHotUpdate(router);
|
if (import.meta.hot) handleHotUpdate(router);
|
||||||
if ($__DEV__) Object.assign(window, { router });
|
if ($__DEV__) Object.assign(window, { router });
|
||||||
|
|
||||||
export function setupRouter(app: import('vue').App) {
|
function setupRouter(app: import('vue').App) {
|
||||||
app
|
app
|
||||||
// Register the plugin before the router
|
// Register the plugin before the router
|
||||||
.use(DataLoaderPlugin, { router })
|
.use(DataLoaderPlugin, { router })
|
||||||
@ -26,3 +27,5 @@ export function setupRouter(app: import('vue').App) {
|
|||||||
createLogGuard(router);
|
createLogGuard(router);
|
||||||
Object.assign(window, { stack: createStackGuard(router) });
|
Object.assign(window, { stack: createStackGuard(router) });
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export { router, setupRouter };
|
||||||
|
Reference in New Issue
Block a user