在error.js中寫入
import store from './store'
export default {
install: (app) => {
app.config.errorHandler = (err, vm, info) => {
store.commit('ADD_LOGS', {
type: 'error',
message: err.message,
stack: err.stack,
info
})
if (process.env.NODE_ENV === 'development') {
console.group('>>>>>> 錯(cuò)誤信息 >>>>>>')
console.log(info)
console.groupEnd();
console.group('>>>>>> Vue 實(shí)例 >>>>>>')
console.log(vm)
console.groupEnd();
console.group('>>>>>> Error >>>>>>')
console.log(err)
console.groupEnd();
}
}
}
}
在store/modules/logs.js注冊(cè)日志相關(guān)東西
// setStore, getStore是針對(duì)localStorage和sessionStorage的封裝,優(yōu)先取session, setStore傳入type值時(shí)聲明sessionStorage存儲(chǔ), 默認(rèn)localStorage
import { setStore, getStore } from 'utils/store'
import dayjs from 'dayjs'
import { sendLogs } from '@/api/user'
const logs = {
state: {
logsList: getStore({ name: 'logsList' }) || [],
},
actions: {
//發(fā)送錯(cuò)誤日志
SendLogs ({ state, commit }) {
return new Promise((resolve, reject) => {
sendLogs(state.logsList).then(() => {
commit('CLEAR_LOGS');
resolve();
}).catch(error => {
reject(error)
})
})
},
},
mutations: {
// 添加日志
ADD_LOGS: (state, { type, message, stack, info }) => {
state.logsList.push(Object.assign({
url: window.location.href,
time: dayjs().format('YYYY-MM-DD HH:mm:ss')
}, {
type,
message,
stack,
info: info.toString()
}))
setStore({ name: 'logsList', content: state.logsList })
},
// 清空日志
CLEAR_LOGS: (state) => {
state.logsList = [];
setStore({ name: 'logsList', content: state.logsList })
}
}
};
export default logs;
在main.js中注冊(cè)插件
import error from './error';
app.use(error);
