vite-uni-dev-tool 0.0.6 → 0.0.7

package/README.md

@@ -151,7 +151,15 @@ uni.__dev__console.log('hello vite-uni-dev-tool');
 
 ## 更新日志
 
+### 0.0.07
+
+- 监听uni.$on
+- 监听uni.%once
+- 监听uni.$emit
+- 监听uni.$of
+
 ### 0.0.6
+
 - 修复 app 查看 source 重启
 
 ### 0.0.5

package/dev/components/Connection/index.vue

@@ -1,7 +1,7 @@
 <template>
   <view class="connection-content">
     <view class="connection-item">
-      <view class="connection-item-title">网络连接</view>
+      <DevToolTitle>网络连接</DevToolTitle>
       <view class="connection-item-content">
         <view class="connection-row">
           <view>IP地址：</view>
@@ -10,8 +10,8 @@
               netWorkStatus?.isConnected === undefined || netWorkStatus?.ip
                 ? 'info'
                 : netWorkStatus?.isConnected && netWorkStatus?.ip
-                ? 'success'
-                : 'error'
+                  ? 'success'
+                  : 'error'
             "
           >
             {{
@@ -28,16 +28,16 @@
               netWorkStatus?.isConnected === undefined
                 ? 'info'
                 : netWorkStatus?.isConnected
-                ? 'success'
-                : 'error'
+                  ? 'success'
+                  : 'error'
             "
           >
             {{
               netWorkStatus?.isConnected === undefined
                 ? '未获取'
                 : netWorkStatus?.isConnected
-                ? '已连接'
-                : '已断开'
+                  ? '已连接'
+                  : '已断开'
             }}
           </Tag>
         </view>
@@ -59,6 +59,7 @@
 </template>
 <script lang="ts" setup>
 import Tag from '../Tag/index.vue';
+import DevToolTitle from '../DevToolTitle/index.vue';
 defineProps<{
   netWorkStatus: {
     isConnected?: boolean;
@@ -73,23 +74,12 @@ defineProps<{
   overflow: auto;
   font-size: var(--dev-tool-base-font-size);
 }
-.connection-content .connection-item {
+.connection-item {
   padding: 16px 16px 0 16px;
   box-sizing: border-box;
 }
-.connection-content .connection-item .connection-item-title {
-  display: flex;
-  align-items: center;
-}
-.connection-content .connection-item .connection-item-title::before {
-  content: '';
-  margin-right: 8px;
-  width: 2px;
-  height: 18px;
-  border-radius: 2px;
-  background-color: var(--dev-tool-main-color);
-}
-.connection-content .connection-item .connection-item-content .connection-row {
+
+.connection-row {
   display: flex;
   align-items: center;
   justify-content: space-between;

package/dev/components/DevTool/index.vue

@@ -28,6 +28,7 @@ import { onShow, onHide, onUnload, onLoad } from '@dcloudio/uni-app';
 import { reactive, ref, nextTick } from 'vue';
 import DevToolButton from '../DevToolButton/index.vue';
 import DevToolWindow from '../DevToolWindow/index.vue';
+import { eventBus } from '../../core';
 
 import {
   EVENT_DEV_BUTTON,
@@ -82,7 +83,7 @@ async function onShowDevToolWindow(show: boolean) {
 }
 
 function onSendMessage(param: { type: string; data: Record<string, any> }) {
-  uni.$emit(DEV_WINDOW_MESSAGE, param);
+  eventBus.emit(DEV_WINDOW_MESSAGE, param);
 }
 
 function onDevOptionSend(options: DevTool.DevToolOptions) {
@@ -110,22 +111,22 @@ onLoad(() => {
   isActive = true;
   devToolButtonVisible.value = uni.getStorageSync(EVENT_DEV_BUTTON) || false;
   devToolWindowVisible.value = show;
-  uni.$on(EVENT_DEV_BUTTON, onShowDevToolButton);
-  uni.$on(EVENT_DEV_WINDOW, onShowDevToolWindow);
-  uni.$on(DEV_OPTION_SEND, onDevOptionSend);
+  eventBus.on(EVENT_DEV_BUTTON, onShowDevToolButton);
+  eventBus.on(EVENT_DEV_WINDOW, onShowDevToolWindow);
+  eventBus.on(DEV_OPTION_SEND, onDevOptionSend);
 
   nextTick(() => {
-    uni.$emit(DEV_WINDOW_MESSAGE, { type: DEV_OPTION_GET, data: {} });
+    eventBus.emit(DEV_WINDOW_MESSAGE, { type: DEV_OPTION_GET, data: {} });
   });
 });
 
 onUnload(() => {
-  uni.$emit(DEV_WINDOW_MESSAGE, {
+  eventBus.emit(DEV_WINDOW_MESSAGE, {
     type: DEV_WINDOW_CLOSE,
     data: {},
   });
-  uni.$off(EVENT_DEV_BUTTON, onShowDevToolButton);
-  uni.$off(EVENT_DEV_WINDOW, onShowDevToolWindow);
+  eventBus.off(EVENT_DEV_BUTTON, onShowDevToolButton);
+  eventBus.off(EVENT_DEV_WINDOW, onShowDevToolWindow);
 });
 
 onShow(() => {

package/dev/components/DevToolTitle/index.vue

@@ -0,0 +1,21 @@
+<template>
+  <view class="dev-tool-title" :style="style"> <slot /> </view>
+</template>
+<script lang="ts" setup>
+defineProps<{ style?: any }>();
+</script>
+<style scoped>
+.dev-tool-title {
+  display: flex;
+  align-items: center;
+  height: 32px;
+}
+.dev-tool-title::before {
+  content: '';
+  margin-right: 8px;
+  width: 2px;
+  height: 18px;
+  border-radius: 2px;
+  background-color: var(--dev-tool-main-color);
+}
+</style>

package/dev/components/DevToolWindow/index.vue

@@ -64,6 +64,12 @@
         @search="onSearchRoute"
         @routeRefresh="onRouteRefresh"
       />
+      <UniEvent
+        v-if="activeTab === 'UniEvent'"
+        :eventList="eventList"
+        :eventCount="eventCount"
+        @clear="onUniEventClear"
+      />
       <SettingList
         v-if="activeTab === 'Setting'"
         :devToolVisible="devToolVisible"
@@ -119,6 +125,7 @@ import DeviceInfo from '../DeviceInfo/index.vue';
 import WindowInfo from '../WindowInfo/index.vue';
 import WebSocket from '../WebSocket/index.vue';
 import UploadList from '../UploadList/index.vue';
+import UniEvent from '../UniEvent/index.vue';
 import {
   DEV_BUTTON_SHOW_OR_HIDE,
   DEV_CONSOLE_CLEAR,
@@ -141,9 +148,11 @@ import {
   DEV_WEBSOCKET_CLEAR,
   DEV_WINDOW_INFO,
   DEV_APP_MESSAGE,
+  DEV_UNI_EVENT_CLEAR,
 } from '../../const';
 import { debounce, hightLight } from '../../utils/index';
 import type { DevTool } from '../../type';
+import { eventBus } from '../../core';
 
 const items = [
   {
@@ -171,12 +180,16 @@ const items = [
     label: 'WebSocket',
     value: 'WebSocket',
   },
-
   {
     key: 'Route',
     label: 'Route',
     value: 'Route',
   },
+  {
+    key: 'UniEvent',
+    label: 'UniEvent',
+    value: 'UniEvent',
+  },
   {
     key: 'Storage',
     label: 'Storage',
@@ -222,6 +235,7 @@ const backup: {
   wsList: DevTool.WS[];
   uploadList: DevTool.UploadItem[];
   routeList: DevTool.Page[];
+  eventList: DevTool.EventItem[];
 } = {
   consoleList: [],
   networkList: [],
@@ -229,6 +243,7 @@ const backup: {
   wsList: [],
   uploadList: [],
   routeList: [],
+  eventList: [],
 };
 const consoleList = ref<DevTool.ConsoleItem[]>([]);
 const networkList = ref<DevTool.NetworkItem[]>([]);
@@ -241,6 +256,8 @@ const piniaList = ref<Record<string, any>>({});
 const systemInfo = ref<Record<string, any>>({});
 const deviceInfo = ref<Record<string, any>>({});
 const windowInfo = ref<Record<string, any>>({});
+const eventList = ref<DevTool.EventItem[]>([]);
+const eventCount = ref<DevTool.EventCount>();
 const netWorkStatus = ref<{
   isConnected?: boolean;
   networkType?: string;
@@ -394,6 +411,13 @@ const listenPostMessage = (data: DevTool.WindowData) => {
       });
     backup.routeList = [...data.routeList];
   }
+  if (data.eventList) {
+    eventList.value = [...data.eventList];
+  }
+
+  if (data.eventCount) {
+    eventCount.value = { ...data.eventCount };
+  }
 
   if (data.vuexList) {
     vuexList.value = data.vuexList;
@@ -439,11 +463,11 @@ onMounted(() => {
 
 onLoad(() => {
   isActive = true;
-  uni.$on(DEV_APP_MESSAGE, listenPostMessage);
+  eventBus.on(DEV_APP_MESSAGE, listenPostMessage);
 });
 onUnload(() => {
   isActive = false;
-  uni.$off(DEV_APP_MESSAGE, listenPostMessage);
+  eventBus.off(DEV_APP_MESSAGE, listenPostMessage);
 });
 
 onShow(() => {
@@ -704,6 +728,20 @@ function onSearchStorage(value: string) {
     });
 }
 
+function onUniEventClear() {
+  eventList.value = [];
+  eventCount.value = {
+    on: 0,
+    once: 0,
+    emit: 0,
+    off: 0,
+  };
+  basicSendMessage({
+    type: DEV_UNI_EVENT_CLEAR,
+    data: {},
+  });
+}
+
 function onGoTo(page: DevTool.Page) {
   basicSendMessage({
     type: DEV_PAGE_JUMP,

package/dev/components/SettingList/index.vue

@@ -1,7 +1,7 @@
 <template>
   <view class="setting-content">
     <view class="setting-item">
-      <view class="setting-item-title">DevTool</view>
+      <DevToolTitle>DevTool</DevToolTitle>
       <view class="setting-item-content">
         <view class="setting-row">
           <view>显示调试按钮：</view>
@@ -25,8 +25,8 @@
         </view>
 
         <view class="setting-tips">
-          点击后将会销毁调试器，销毁后不再接收调试信息，需要通过
-          createDevTool() 重新创建
+          点击后将会销毁调试器，销毁后不再接收调试信息，需要通过 createDevTool()
+          重新创建
         </view>
         <DButton class="setting-button" @click="onDestructionDevTool">
           销毁调试器
@@ -52,7 +52,7 @@
       </view>
     </view>
     <view class="setting-item">
-      <view class="setting-item-title">Log</view>
+      <DevToolTitle>Log</DevToolTitle>
       <view class="setting-item-content">
         <view class="setting-row">
           <view>导出当前日志信息：</view>
@@ -121,6 +121,7 @@
 import { reactive } from 'vue';
 import Checkbox from '../Checkbox/index.vue';
 import DButton from '../Button/index.vue';
+import DevToolTitle from '../DevToolTitle/index.vue';
 const props = defineProps<{
   devToolVisible?: boolean;
   sizeFormat?: string;
@@ -204,30 +205,19 @@ function onClearCache() {
   overflow: auto;
   font-size: var(--dev-tool-base-font-size);
 }
-.setting-content .setting-item {
+.setting-item {
   padding: 16px 16px 0 16px;
   box-sizing: border-box;
 }
-.setting-content .setting-item .setting-item-title {
-  display: flex;
-  align-items: center;
-}
-.setting-content .setting-item .setting-item-title::before {
-  content: '';
-  margin-right: 8px;
-  width: 2px;
-  height: 18px;
-  border-radius: 2px;
-  background-color: var(--dev-tool-main-color);
-}
-.setting-content .setting-item .setting-item-content .setting-row {
+
+.setting-row {
   display: flex;
   align-items: center;
   justify-content: space-between;
   margin: 8px 0;
   min-height: 18px;
 }
-.setting-content .setting-tips {
+.setting-tips {
   color: #616161;
   font-size: var(--dev-tool-tips-font-size);
   margin-bottom: 8px;

package/dev/components/UniEvent/UniEventItem.vue

@@ -0,0 +1,55 @@
+<template>
+  <view class="uni-event-item">
+    <view class="uni-event-item-row"> {{ eventItem.eventName }} </view>
+    <view class="uni-event-item-row">
+      <Tag mode="info" v-if="eventItem.type == 'on'">
+        {{ eventItem.type }}
+      </Tag>
+      <Tag mode="warn" v-if="eventItem.type == 'once'">
+        {{ eventItem.type }}
+      </Tag>
+      <Tag mode="main" v-if="eventItem.type == 'emit'">
+        {{ eventItem.type }}
+      </Tag>
+      <Tag mode="error" v-if="eventItem.type == 'off'">
+        {{ eventItem.type }}
+      </Tag>
+      <view class="uni-event-item-right"> {{ eventItem.timer }}</view>
+    </view>
+
+    <view class="uni-event-item-right link">
+      {{ eventItem.stock }}
+    </view>
+  </view>
+</template>
+<script lang="ts" setup>
+import Tag from '../Tag/index.vue';
+import type { DevTool } from '../../type';
+
+defineProps<{ eventItem: DevTool.EventItem }>();
+</script>
+
+<style scoped>
+.uni-event-item {
+  padding: 16px;
+  border-bottom: 1px solid var(--dev-tool-border-color);
+  box-sizing: border-box;
+}
+
+.uni-event-item-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 28px;
+  word-break: break-all;
+}
+
+.uni-event-item-right {
+  text-align: right;
+  word-break: break-all;
+}
+.link {
+  cursor: pointer;
+  text-decoration: underline;
+}
+</style>

package/dev/components/UniEvent/index.vue

@@ -0,0 +1,85 @@
+<template>
+  <view class="uni-event-content">
+    <DevToolTitle style="padding: 0 16px">事件触发统计</DevToolTitle>
+    <view class="uni-event-statistics">
+      <view class="uni-event-statistics-item">
+        <view>on: </view>
+        <Tag mode="log" style="flex: 1; justify-content: center">
+          {{ eventCount?.on ?? 0 }}
+        </Tag>
+      </view>
+      <view class="uni-event-statistics-item">
+        <view>once: </view>
+        <Tag mode="warn" style="flex: 1; justify-content: center">
+          {{ eventCount?.once ?? 0 }}
+        </Tag>
+      </view>
+      <view class="uni-event-statistics-item">
+        <view>emit: </view>
+        <Tag mode="main" style="flex: 1; justify-content: center">
+          {{ eventCount?.emit ?? 0 }}
+        </Tag>
+      </view>
+      <view class="uni-event-statistics-item">
+        <view>off: </view>
+        <Tag mode="error" style="flex: 1; justify-content: center">
+          {{ eventCount?.off ?? 0 }}
+        </Tag>
+      </view>
+    </view>
+    <DevToolTitle style="padding: 0 16px"
+      >事件触发列表
+
+      <Tag mode="clear" style="margin-left: auto" @click="emit('clear')">
+        清空
+      </Tag>
+    </DevToolTitle>
+    <view class="uni-event-list">
+      <UniEventItem v-for="item in eventList" :eventItem="item" />
+    </view>
+  </view>
+</template>
+<script lang="ts" setup>
+import DevToolTitle from '../DevToolTitle/index.vue';
+import UniEventItem from './UniEventItem.vue';
+import Tag from '../Tag/index.vue';
+import type { DevTool } from '@/dev/type';
+
+defineProps<{
+  eventList?: DevTool.EventItem[];
+  eventCount?: DevTool.EventCount;
+}>();
+
+const emit = defineEmits<{
+  (e: 'clear'): void;
+}>();
+</script>
+<style scoped>
+.uni-event-content {
+  height: 100%;
+  overflow: auto;
+  font-size: var(--dev-tool-base-font-size);
+}
+
+.uni-event-statistics {
+  display: flex;
+  align-items: center;
+  justify-content: space-around;
+  padding: 0 16px;
+  height: 32px;
+  box-sizing: border-box;
+  gap: 12px;
+}
+.uni-event-statistics-item {
+  display: flex;
+  align-items: center;
+  width: 25%;
+}
+.uni-event-statistics-item view:first-child {
+  margin-right: 8px;
+}
+.uni-event-list {
+  height: calc(100% - 32px * 3);
+  overflow: auto;
+}
+</style>

package/dev/const.ts

@@ -90,6 +90,8 @@ export const DEV_ROUTE_REFRESH = 'dev-route-refresh';
 /** 获取 dev option */
 export const DEV_OPTION = 'dev-option';
 
-export const  DEV_OPTION_GET = 'dev-option-get';
+export const DEV_OPTION_GET = 'dev-option-get';
 
-export const  DEV_OPTION_SEND = 'dev-option-send';
+export const DEV_OPTION_SEND = 'dev-option-send';
+
+export const DEV_UNI_EVENT_CLEAR = 'dev-uni-event-clear';

package/dev/core.ts

@@ -6,6 +6,7 @@ import { DevConsole } from './devConsole';
 
 import type { DevTool } from './type';
 
+import { EventBus } from './devEventBus';
 /**
  * 备份原生方法
  *
@@ -26,12 +27,21 @@ const backup = {
   reject: Promise.reject,
   connectSocket: uni?.connectSocket,
   uploadFile: uni?.uploadFile,
+  $on: uni.$on,
+  $once: uni.$once,
+  $emit: uni.$emit,
+  $off: uni.$off,
   __log__: (uni as any).__log__,
 };
 
+const eventBus = new EventBus();
+
 const store = new DevStore();
 
-const event = new DevEvent(store);
+const event = new DevEvent({
+  store,
+  eventBus,
+});
 
 const console = new DevConsole(event);
 
@@ -106,4 +116,5 @@ export {
   getDevToolOptions,
   interceptVuexStorage,
   interceptPiniaStore,
+  eventBus,
 };

package/dev/devEvent/index.ts

@@ -28,6 +28,7 @@ import {
   DEV_WINDOW_CLOSE,
   DEV_OPTION_GET,
   DEV_OPTION_SEND,
+  DEV_UNI_EVENT_CLEAR,
 } from '../const';
 import { DevStore } from '../devStore';
 import type { DevTool } from '../type';
@@ -39,6 +40,7 @@ import {
   saveTextFileH5,
   saveTextFileMicro,
 } from '../utils/index';
+import type { EventBus } from '../devEventBus';
 
 /**
  * 事件中心
@@ -49,8 +51,11 @@ import {
 export class DevEvent {
   private store: DevStore;
 
-  constructor(store: DevStore) {
+  private eventBus: EventBus;
+
+  constructor({ store, eventBus }: { store: DevStore; eventBus: EventBus }) {
     this.store = store;
+    this.eventBus = eventBus;
     this.acceptMessage();
   }
 
@@ -67,7 +72,7 @@ export class DevEvent {
     data.size = size;
     data.sizeFormat = sizeFormat;
 
-    uni.$emit(DEV_APP_MESSAGE, data);
+    this.eventBus.emit(DEV_APP_MESSAGE, data);
 
     if (size > this.store.cacheMaxSize) {
       this.store?.clearDevCache();
@@ -136,8 +141,12 @@ export class DevEvent {
 
     this.resetInterceptSwitchTab();
 
+    this.resetUniEvent();
+
     this.store.setDevToolDestroy(true);
 
+    this.eventBus.clear();
+
     console.warn('[DevTool] 调试器已销毁');
   }
 
@@ -163,7 +172,7 @@ export class DevEvent {
     setTimeout(async () => {
       this.postMessage();
     }, 100);
-    uni.$emit(EVENT_DEV_WINDOW, true);
+    this.eventBus.emit(EVENT_DEV_WINDOW, true);
   }
 
   /**
@@ -172,7 +181,7 @@ export class DevEvent {
    * @memberof DevEvent
    */
   closeDevToolWindow() {
-    uni.$emit(EVENT_DEV_WINDOW, false);
+    this.eventBus.emit(EVENT_DEV_WINDOW, false);
   }
 
   /**
@@ -183,7 +192,7 @@ export class DevEvent {
   showDevToolButton() {
     const isDestroy = uni.getStorageSync(DEV_IS_DESTROY) ?? false;
     if (isDestroy) return;
-    uni.$emit(EVENT_DEV_BUTTON, true);
+    this.eventBus.emit(EVENT_DEV_BUTTON, true);
     uni.setStorageSync(EVENT_DEV_BUTTON, true);
     this.store.setDevToolVisible(true);
   }
@@ -196,7 +205,7 @@ export class DevEvent {
   hideDevToolButton() {
     const isDestroy = uni.getStorageSync(DEV_IS_DESTROY) ?? false;
     if (isDestroy) return;
-    uni.$emit(EVENT_DEV_BUTTON, false);
+    this.eventBus.emit(EVENT_DEV_BUTTON, false);
     uni.setStorageSync(EVENT_DEV_BUTTON, false);
     this.store.setDevToolVisible(false);
   }
@@ -281,7 +290,7 @@ export class DevEvent {
   sendDevToolOption() {
     const options = this.store.getDevToolOptions();
 
-    uni.$emit(DEV_OPTION_SEND, options);
+    this.eventBus.emit(DEV_OPTION_SEND, options);
   }
 
   /**
@@ -290,7 +299,7 @@ export class DevEvent {
    * @memberof DevEvent
    */
   acceptMessage() {
-    uni.$on(
+    this.eventBus.on(
       DEV_WINDOW_MESSAGE,
       (data: {
         type: string;
@@ -406,6 +415,8 @@ export class DevEvent {
         // 获取dev options 数据
         else if (data.type === DEV_OPTION_GET) {
           this.sendDevToolOption();
+        } else if (data.type === DEV_UNI_EVENT_CLEAR) {
+          this.uniEventClear();
         }
       },
     );
@@ -662,4 +673,23 @@ export class DevEvent {
   getDevToolDestroy() {
     return this.store.getDevToolDestroy();
   }
+
+  updateUniEventCount(type: DevTool.EventCountKey) {
+    this.store.updateUniEventCount(type);
+    this.postMessage();
+  }
+  updateUniEventList(eventList: DevTool.EventItem[]) {
+    this.store.updateUniEventList(eventList);
+    this.postMessage();
+  }
+  uniEventClear() {
+    this.store.uniEventClear();
+  }
+
+  resetUniEvent() {
+    uni.$on = backup.$on;
+    uni.$once = backup.$once;
+    uni.$emit = backup.$emit;
+    uni.$off = backup.$off;
+  }
 }

package/dev/devEventBus/index.ts

@@ -0,0 +1,94 @@
+type EventHandler<T = any> = (payload: T) => void;
+
+export class EventBus {
+  // 使用 Map 存储事件及其对应的回调函数数组
+  private events: Map<string, EventHandler[]> = new Map();
+
+  /**
+   * 订阅事件
+   * @param eventName 事件名称
+   * @param handler 事件处理函数
+   * @returns 返回一个取消订阅的函数
+   */
+  on<T = any>(eventName: string, handler: EventHandler<T>): () => void {
+    if (!this.events.has(eventName)) {
+      this.events.set(eventName, []);
+    }
+    const handlers = this.events.get(eventName)!;
+    handlers.push(handler as EventHandler);
+
+    // 返回取消订阅的函数
+    return () => {
+      this.off(eventName, handler);
+    };
+  }
+
+  /**
+   * 发布事件
+   * @param eventName 事件名称
+   * @param payload 事件携带的数据
+   */
+  emit<T = any>(eventName: string, payload: T): void {
+    if (this.events.has(eventName)) {
+      const handlers = [...this.events.get(eventName)!];
+      handlers.forEach((handler) => handler(payload));
+    }
+  }
+
+  /**
+   * 取消订阅事件
+   * @param eventName 事件名称
+   * @param handler 要取消的事件处理函数
+   */
+  off<T = any>(eventName: string, handler: EventHandler<T>): void {
+    if (this.events.has(eventName)) {
+      const handlers = this.events.get(eventName)!;
+      this.events.set(
+        eventName,
+        handlers.filter((h) => h !== handler),
+      );
+    }
+  }
+
+  /**
+   * 只订阅一次事件，触发后自动取消订阅
+   * @param eventName 事件名称
+   * @param handler 事件处理函数
+   */
+  once<T = any>(eventName: string, handler: EventHandler<T>): void {
+    const wrapper = (payload: T) => {
+      handler(payload);
+      this.off(eventName, wrapper);
+    };
+    this.on(eventName, wrapper);
+  }
+
+  /**
+   * 清除指定事件的所有订阅者，如果未提供事件名称，则清除所有事件
+   * @param eventName 可选的事件名称
+   */
+  clear(eventName?: string): void {
+    if (eventName) {
+      this.events.delete(eventName);
+    } else {
+      this.events.clear();
+    }
+  }
+
+  /**
+   * 获取指定事件的订阅者数量，如果未提供事件名称，则返回所有事件的订阅者总数
+   * @param eventName 可选的事件名称
+   * @returns 订阅者数量
+   */
+  count(eventName?: string): number {
+    if (eventName) {
+      return this.events.has(eventName)
+        ? this.events.get(eventName)!.length
+        : 0;
+    }
+    return Array.from(this.events.values()).reduce(
+      (sum, handlers) => sum + handlers.length,
+      0,
+    );
+  }
+}

package/dev/devIntercept/index.ts

@@ -1,3 +1,4 @@
+import { DEV_APP_MESSAGE } from '../const';
 import { backup } from '../core';
 import { DevEvent } from '../devEvent';
 import type { DevTool } from '../type';
@@ -20,6 +21,11 @@ export class DevIntercept {
 
   initPinia = false;
 
+  cache$on = new Map();
+  cache$once = new Map();
+  cache$emit = new Map();
+  cache$off = new Map();
+
   constructor(options: DevTool.DevInterceptOptions) {
     this.event = options.event;
     this.init(options);
@@ -41,6 +47,8 @@ export class DevIntercept {
     this.interceptSwitchTab();
     this.interceptNavigateTo();
 
+    this.interceptUniEvent();
+
     options.enableInterceptPromiseReject && this.interceptPromiseReject();
   }
 
@@ -681,4 +689,33 @@ export class DevIntercept {
     };
     uni.uploadFile = uploadFile.bind(uni);
   }
+
+  interceptUniEventFactory(type: DevTool.EventCountKey) {
+    const key = `$${type}` as '$on' | '$emit' | '$once' | '$off';
+
+    uni[`$${type}`] = (eventName: string, callback: (result: any) => void) => {
+      const stockList = new Error()?.stack?.split('\n');
+      const stock = stockList?.[2];
+      backup?.[key]?.(eventName, callback);
+
+      this.event.updateUniEventList([
+        {
+          eventName,
+          timer: getCurrentDate(),
+          stock,
+          type,
+        },
+      ]);
+
+      this.event.updateUniEventCount(type);
+    };
+  }
+
+  interceptUniEvent() {
+    // 判断是否是相同的位置注册，相同的位置注册只算一次
+    this.interceptUniEventFactory('on');
+    this.interceptUniEventFactory('once');
+    this.interceptUniEventFactory('emit');
+    this.interceptUniEventFactory('off');
+  }
 }

package/dev/devStore/index.ts

@@ -11,6 +11,7 @@ import {
   getWifiIp,
   isBoolean,
 } from '../utils/index';
+import { backup } from '../core';
 
 /** 数据存储中心  */
 export class DevStore {
@@ -28,6 +29,13 @@ export class DevStore {
     wsList: [],
     netWorkStatus: {},
     uploadList: [],
+    eventList: [],
+    eventCount: {
+      on: 0,
+      once: 0,
+      emit: 0,
+      off: 0,
+    },
   };
 
   /** 调试配置 */
@@ -40,6 +48,9 @@ export class DevStore {
   private networkMaxSize = 1000;
   /** ws数据最大值 */
   private wsDataMaxSize = 1000;
+  /** 事件列表最大值 */
+  private eventMaxSize = 1000;
+
   /** 缓存最大值 */
   cacheMaxSize = 8 * 1024 * 1024 * 10;
 
@@ -314,6 +325,14 @@ export class DevStore {
     this.state.windowInfo = {};
     this.state.systemInfo = {};
     this.state.netWorkStatus = {};
+
+    this.state.eventList = [];
+    this.state.eventCount = {
+      on: 0,
+      once: 0,
+      emit: 0,
+      off: 0,
+    };
   }
 
   addUploadTask(index: number | string, task: UniApp.UploadTask) {
@@ -599,4 +618,58 @@ export class DevStore {
     }
     return '';
   }
+
+  /**
+   * 新增事件
+   *
+   * @param {DevTool.EventItem} event
+   * @memberof DevStore
+   */
+  addEventItem(event: DevTool.EventItem) {
+    if (!this.state.eventList) {
+      this.state.eventList = [];
+    }
+    this.state.eventList?.push(event);
+  }
+
+  /**
+   * 增加注册事件的数量
+   *
+   * @param {DevTool.EventCountKey} type
+   * @memberof DevStore
+   */
+  updateUniEventCount(type: DevTool.EventCountKey) {
+    if (!this.state.eventCount) {
+      this.state.eventCount = {
+        on: 0,
+        once: 0,
+        emit: 0,
+        off: 0,
+      };
+    }
+    this.state.eventCount[type] = this.state.eventCount[type] + 1;
+  }
+
+  updateUniEventList(evenList: DevTool.EventItem[]) {
+    const len = this.state.eventList?.length ?? 0;
+    const max = this.eventMaxSize;
+
+    if (len + evenList.length > max) {
+      this.state.eventList?.splice(0, len - max - evenList.length);
+    }
+    this.state.eventList?.push(...evenList);
+    console.log('this.state.eventList: ', this.state.eventList);
+
+    return this.state.eventList;
+  }
+
+  uniEventClear() {
+    this.state.eventCount = {
+      on: 0,
+      once: 0,
+      emit: 0,
+      off: 0,
+    };
+    this.state.eventList = [];
+  }
 }

package/dev/type.ts

@@ -175,6 +175,25 @@ export declare namespace DevTool {
     totalBytesExpectedToSend?: number;
   };
 
+  type EventCount = {
+    on: number;
+    once: number;
+    emit: number;
+    off: number;
+  };
+  type EventCountKey = keyof EventCount;
+
+  type EventItem = {
+    /** 事件名称 */
+    eventName?: string;
+    /** 触发事件 */
+    timer?: string;
+    /** 调用位置 */
+    stock?: string;
+    /** 事件类型 */
+    type?: string;
+  };
+
   type WindowData = {
     devToolVisible?: boolean;
     consoleList?: ConsoleItem[];
@@ -191,6 +210,8 @@ export declare namespace DevTool {
     size?: number;
     sizeFormat?: string;
     uploadList?: UploadItem[];
+    eventCount?: EventCount;
+    eventList?: EventItem[];
   };
 
   type DevInterceptOptions = {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-uni-dev-tool",
-  "version": "0.0.6",
+  "version": "0.0.7",
   "description": "vite-uni-dev-tool, debug, uni-app, 一处编写，到处调试",
   "keywords": [
     "vite",