report-err-plugin

report-err-plugin 是一个用于捕获和上报错误信息的 JavaScript 插件。它可以捕获全局的资源加载错误、JS 错误和未捕获的 Promise 错误，并上报。

安装

使用 npm 安装：

npm install report-err-plugin

使用

在你的项目中引入 report-err-plugin，并创建一个新的实例：

import reportErrPlugin from 'report-err-plugin'

const reportErrInstance = new reportErrPlugin({
  maxSize: 1,
  reportFunc (data) {
    console.log(data);
  }
})

在 vue 项目中：

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import axios from 'axios'
import reportErrPlugin from 'report-err-plugin'

const app = createApp(App)

const reportErrInstance = new reportErrPlugin({
  maxSize: 1,
  reportFunc (data) {
    // 将错误信息通过 ajax 传输到服务端
    axios.post('/url', data)
  }
})

app.use(reportErrInstance).use(router).mount('#app')

然后，你可以使用 reportErrInstance 来捕获和上报错误信息。

配置

reportErrPlugin 的构造函数接收一个配置对象，包含以下的属性：

• maxSize: 需要上报的信息累计到多少条才进行上报，一般不会产生一条错误就马上进行上报，而是累积到一定量再一次性上报。

• reportFunc: 一般在此函数中将得到的错误信息通过 ajax 传输到服务器

API

reportErrPlugin 类提供了以下的方法：

• report(err): 手动上报错误，将错误信息添加到 waitReportList，并在达到最大数量时调用 _report() 方法上报。

• _report(): 调用用户传入的 reportFunc 方法上报错误信息，然后清空 waitReportList。

• forceReport(): 调用此方法将进行强制上报错误，而不用等待错误信息累积达到 maxSize。

• clearReportList(): 清空 waitReportList。

• install(app): 用于 Vue 插件的安装，注册 errorHandler 事件。