vite-uni-dev-tool 0.0.6 → 0.0.8

package/dev/type.ts

@@ -58,6 +58,8 @@ export declare namespace DevTool {
     uploadMaxSize?: number;
     /** 最大的套接字消息条数 */
     wsDataMaxSize?: number;
+    /** 最大的时间列表条数 */
+    eventListMaxSize?: number;
     /** 最大占用缓存空间 */
     cacheMaxSize?: number;
     /** 所有路由信息 */
@@ -141,12 +143,32 @@ export declare namespace DevTool {
     | 'profileEnd'
     | 'timeStamp';
 
+  type ValueType =
+    | 'number'
+    | 'string'
+    | 'boolean'
+    | 'null'
+    | 'undefined'
+    | 'symbol'
+    | 'array'
+    | 'object';
+
+  type Arg = {
+    type: ValueType;
+    value: any;
+  };
+
   type ConsoleItem = {
     type: string;
-    args: any[];
+    args: Arg[];
     position: string;
     time: string;
     stack?: string;
+    /**
+     * input 输入
+     * output 输出
+     */
+    mode?: 'input' | 'output';
   };
 
   type UploadItem = {
@@ -175,6 +197,39 @@ 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;
+    /** 调用位置 */
+    stack?: string;
+    /** 事件类型 */
+    type?: string;
+  };
+
+  type RunJSItem = {
+    /** 代码 */
+    code?: string;
+    /** 结果 */
+    result?: any;
+    /** 开始时间 */
+    timer?: string;
+    /** 执行用时 */
+    duration?: number;
+    /** 执行状态 */
+    type?: string;
+    mode?: 'input' | 'output';
+  };
+
   type WindowData = {
     devToolVisible?: boolean;
     consoleList?: ConsoleItem[];
@@ -191,6 +246,8 @@ export declare namespace DevTool {
     size?: number;
     sizeFormat?: string;
     uploadList?: UploadItem[];
+    eventCount?: EventCount;
+    eventList?: EventItem[];
   };
 
   type DevInterceptOptions = {

package/dev/utils/index.ts

@@ -1,10 +1,19 @@
-export { isNil, isBoolean, isNumber, isObject, isArray } from './language';
+export {
+  isNil,
+  isBoolean,
+  isNumber,
+  isObject,
+  isArray,
+  getValueType,
+  transformValueToView,
+} from './language';
 export {
   setValueByPath,
   getValueByPath,
   calculateObjectSize,
   formatStorageSize,
   serializeCircular,
+  parseValue,
 } from './object';
 
 export { throttle, debounce } from './function';

package/dev/utils/language.ts

@@ -1,3 +1,4 @@
+import type { DevTool } from '../type';
 export function isNil(value: any): value is null | undefined {
   return value === null || value === undefined;
 }
@@ -17,3 +18,55 @@ export function isObject(value: any): value is object {
 export function isArray(value: any): value is any[] {
   return Array.isArray(value);
 }
+
+export function isString(value: any): value is string {
+  return typeof value === 'string';
+}
+
+export function isNull(value: any): value is null {
+  return value === null;
+}
+
+export function isUndefined(value: any): value is undefined {
+  return value === undefined;
+}
+
+export function isSymbol(value: any): value is symbol {
+  return typeof value === 'symbol';
+}
+
+/**
+ *
+ *
+ * @export
+ * @param {*} value
+ * @return {*}  {DevTool.ValueType}
+ */
+export function getValueType(value: any): DevTool.ValueType {
+  if (isNull(value)) return 'null';
+  if (isUndefined(value)) return 'undefined';
+  if (isNumber(value)) return 'number';
+  if (isString(value)) return 'string';
+  if (isArray(value)) return 'array';
+  if (isObject(value)) return 'object';
+  if (isSymbol(value)) return 'symbol';
+  return 'string';
+}
+
+/**
+ * 将 console 入参转vue 可视值
+ *
+ * @export
+ * @param {*} value
+ * @return {*}  {DevTool.ValueType}
+ */
+export function transformValueToView(value: any): DevTool.ValueType {
+  if (isNull(value)) return 'string';
+  if (isUndefined(value)) return 'string';
+  if (isString(value)) return 'string';
+  if (isNumber(value)) return 'number';
+  if (isArray(value)) return 'array';
+  if (isObject(value)) return 'object';
+  if (isSymbol(value)) return 'symbol';
+  return 'string';
+}

package/dev/utils/object.ts

@@ -1,3 +1,5 @@
+import { isNil, isObject, isString } from './language';
+
 /**
  * 自定义set函数 - 安全地设置嵌套对象属性
  * @param obj 目标对象
@@ -66,6 +68,7 @@ export function getValueByPath(obj: any, path: string, defaultValue?: any) {
  * @returns 对象的近似大小（以字节为单位）
  */
 export function calculateObjectSize(obj: any): number {
+  obj = parseValue(obj);
   // 处理基本类型
   if (obj === null || obj === undefined) {
     return 0;
@@ -118,7 +121,7 @@ export function calculateObjectSize(obj: any): number {
   } else {
     // 计算对象每个属性的大小
     for (const key in obj) {
-      if (obj.hasOwnProperty(key)) {
+      if (obj?.hasOwnProperty?.(key)) {
         // 属性名的大小(假设每个字符占2字节)
         totalSize += key.length * 2;
         // 属性引用(假设每个引用占8字节)
@@ -233,3 +236,63 @@ export function serializeCircular(
 
   return `{${serializedProps.join(', ')}}`;
 }
+
+/**
+ * 处理value
+ * 基础类型数据直接返回value
+ * 引用类型数据判断 value 是否存在循环引用的情况，存在则将循环引用的第二次赋值为  [Circular]
+ * 最大处理 deep 层数
+ *
+ * @export
+ * @param {*} value
+ * @param {number} [deep=6]
+ */
+export function parseValue(value: any, deep: number = 6) {
+  const seen = new WeakMap<object, string[]>(); // 存储对象及其路径
+
+  function process(value: any, currentDeep: number, path: string[] = []): any {
+    if (isString(value)) {
+      return `"${value}"`;
+    }
+
+    if (isNil(value)) {
+      return `${value}`;
+    }
+
+    // 处理基本类型
+    if (!isObject(value)) {
+      return value;
+    }
+
+    // 检查是否达到最大深度
+    if (currentDeep <= 0) {
+      return '[MaxDepth]';
+    }
+
+    // 检查循环引用
+    if (seen.has(value)) {
+      const circularPath = seen.get(value)!.join('.');
+      return `[Circular: ${circularPath}]`;
+    }
+
+    // 标记当前对象为已访问，并记录路径
+    seen.set(value, [...path]);
+
+    // 处理数组
+    if (Array.isArray(value)) {
+      return value.map((item, index) =>
+        process(item, currentDeep - 1, [...path, String(index)]),
+      );
+    }
+
+    // 处理对象
+    const result: Record<string, any> = {};
+    for (const [key, val] of Object.entries(value)) {
+      result[key] = process(val, currentDeep - 1, [...path, key]);
+    }
+
+    return result;
+  }
+
+  return process(value, deep);
+}

package/dev/utils/string.ts

@@ -102,11 +102,11 @@ const stockReg =
  * 解析栈信息
  *
  * @export
- * @param {string} stock
+ * @param {string} stack
  * @return {*}
  */
-export function parseStock(stock: string) {
-  const match = stock.match(stockReg);
+export function parseStock(stack: string) {
+  const match = stack.match(stockReg);
   return {
     info: match?.[1] ?? '',
     path: match?.[2] ?? '',
@@ -116,6 +116,6 @@ export function parseStock(stock: string) {
 }
 
 const mockWXReg = /https?:\/\/usr/;
-export function isMockWX(stock: string) {
-  return mockWXReg.test(stock);
+export function isMockWX(stack: string) {
+  return mockWXReg.test(stack);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-uni-dev-tool",
-  "version": "0.0.6",
+  "version": "0.0.8",
   "description": "vite-uni-dev-tool, debug, uni-app, 一处编写，到处调试",
   "keywords": [
     "vite",
@@ -40,4 +40,4 @@
   "publishConfig": {
     "access": "public"
   }
-}
+}