@4399ywkf/cli 0.0.21 → 1.0.2

package/dist/templates/utils/env.ts

@@ -0,0 +1,3 @@
+export const isDev = process.env.NODE_ENV === 'development';
+
+export const isOnServerSide = typeof window === 'undefined';

package/dist/templates/utils/format.ts

@@ -0,0 +1,21 @@
+/**
+ * 字节转换函数
+ * @param kb
+ * @returns
+ */
+interface FormatSizeUnitsProps {
+  kb: number;
+  units?: string[];
+}
+export function formatSizeUnits(props: FormatSizeUnitsProps) {
+  const { kb, units = ['KB', 'MB', 'GB', 'TB', 'PB'] } = props;
+  let newKb = kb;
+  let unitIndex = 0;
+
+  while (kb >= 1024 && unitIndex < units.length - 1) {
+    newKb = newKb / 1024;
+    unitIndex++;
+  }
+
+  return `${kb.toFixed(2)} ${units[unitIndex]}`;
+}

package/dist/templates/utils/genCdnUrl.ts

@@ -0,0 +1,30 @@
+import urlJoin from 'url-join';
+
+const UNPKG_API = 'https://unpkg.com';
+const ALIYUN_API = 'https://registry.npmmirror.com';
+
+export type CDN = 'aliyun' | 'unpkg';
+export interface CdnApi {
+  path: string;
+  pkg: string;
+  proxy?: CDN;
+  version?: string;
+}
+
+export const genCdnUrl = ({
+  pkg,
+  version = 'latest',
+  path,
+  proxy,
+}: CdnApi): string => {
+  switch (proxy) {
+    case 'unpkg': {
+      return urlJoin(UNPKG_API, `${pkg}@${version}`, path);
+    }
+    default: {
+      return urlJoin(ALIYUN_API, pkg, version, 'files', path);
+    }
+  }
+};
+
+export { ALIYUN_API, UNPKG_API };

package/dist/templates/utils/getMicroApp.ts

@@ -0,0 +1,39 @@
+// 创建一个空数组来存储匹配的对象
+let matchedObjects: any[] = [];
+
+// 定义一个递归函数来遍历子路由对象
+function traverseRoutes(routes) {
+  for (const route of routes) {
+    // 检查当前子路由对象是否具有"microApp"属性
+    if (Object.prototype.hasOwnProperty.call(route, 'microApp')) {
+      // 如果有，将该子路由对象添加到结果数组中
+      matchedObjects.push(route);
+    }
+
+    // 检查当前子路由对象是否还有更深层级的子路由
+    if (Object.prototype.hasOwnProperty.call(route, 'routes')) {
+      // 递归调用自身来遍历更深层级的子路由对象
+      traverseRoutes(route.routes);
+    }
+  }
+}
+
+export const getMicroApp = (a: any[]) => {
+  matchedObjects = [];
+  // 遍历变量a中的每个对象
+  for (const obj of a) {
+    // 检查当前对象是否具有"microApp"属性
+    if (Object.prototype.hasOwnProperty.call(obj, 'microApp')) {
+      // 如果有，将该对象添加到结果数组中
+      matchedObjects.push(obj);
+    }
+
+    // 检查当前对象是否具有"routes"属性
+    if (Object.prototype.hasOwnProperty.call(obj, 'routes')) {
+      // 调用递归函数来遍历子路由对象
+      traverseRoutes(obj.routes);
+    }
+  }
+
+  return matchedObjects;
+};

package/dist/templates/utils/index.ts

@@ -0,0 +1 @@
+export * from "./getMicroApp";

package/dist/templates/utils/locale.ts

@@ -0,0 +1,46 @@
+import { resolveAcceptLanguage } from 'resolve-accept-language';
+
+import { DEFAULT_LANG } from '@/const/locale';
+import { locales, normalizeLocale } from '@/locales/resources';
+
+export const getAntdLocale = async (lang?: string) => {
+  let normalLang = normalizeLocale(lang);
+
+  // due to antd only have ar-EG locale, we need to convert ar to ar-EG
+  // refs: https://ant.design/docs/react/i18n
+
+  // And we don't want to handle it in `normalizeLocale` function
+  // because of other locale files are all `ar` not `ar-EG`
+  if (normalLang === 'ar') normalLang = 'ar-EG';
+
+  const { default: locale } = await import(`antd/locale/${normalLang.replace('-', '_')}.js`);
+
+  return locale;
+};
+
+/**
+ * Parse the browser language and return the fallback language
+ */
+export const parseBrowserLanguage = (headers: Headers, defaultLang: string = DEFAULT_LANG) => {
+  // if the default language is not 'en-US', just return the default language as fallback lang
+  if (defaultLang !== 'en-US') return defaultLang;
+
+  /**
+   * The arguments are as follows:
+   *
+   * 1) The HTTP accept-language header.
+   * 2) The available locales (they must contain the default locale).
+   * 3) The default locale.
+   */
+  let browserLang: string = resolveAcceptLanguage(
+    headers.get('accept-language') || '',
+    //  Invalid locale identifier 'ar'. A valid locale should follow the BCP 47 'language-country' format.
+    locales.map((locale) => (locale === 'ar' ? 'ar-EG' : locale)),
+    defaultLang,
+  );
+
+  // if match the ar-EG then fallback to ar
+  if (browserLang === 'ar-EG') browserLang = 'ar';
+
+  return browserLang;
+};

package/dist/templates/utils/sentry.ts

@@ -0,0 +1,187 @@
+import * as Sentry from '@sentry/react';
+
+// 性能监控
+export const sentryPerformance = {
+  // 开始性能追踪
+  startSpan: (name: string, op?: string) => {
+    return Sentry.startSpan(
+      {
+        name,
+        op: op || 'custom',
+      },
+      (span) => {
+        return span;
+      },
+    );
+  },
+
+  // 测量函数执行时间
+  measureFunction: <T extends any[], R>(fn: (...args: T) => R, name: string, op?: string): ((...args: T) => R) => {
+    return (...args: T): R => {
+      return Sentry.startSpan(
+        {
+          name,
+          op: op || 'function',
+        },
+        () => fn(...args),
+      );
+    };
+  },
+
+  // 测量异步函数
+  measureAsyncFunction: <T extends any[], R>(fn: (...args: T) => Promise<R>, name: string, op?: string): ((...args: T) => Promise<R>) => {
+    return async (...args: T): Promise<R> => {
+      return Sentry.startSpan(
+        {
+          name,
+          op: op || 'async_function',
+        },
+        async () => await fn(...args),
+      );
+    };
+  },
+
+  // 添加面包屑
+  addBreadcrumb: (message: string, category?: string, level?: Sentry.SeverityLevel) => {
+    Sentry.addBreadcrumb({
+      message,
+      category: category || 'custom',
+      level: level || 'info',
+      timestamp: Date.now() / 1000,
+    });
+  },
+
+  // 手动创建 span
+  withSpan: <T>(name: string, op: string, callback: () => T): T => {
+    return Sentry.startSpan({ name, op }, callback);
+  },
+};
+
+// 错误报告
+export const sentryError = {
+  // 捕获异常
+  captureException: (error: Error, context?: Record<string, any>) => {
+    Sentry.withScope((scope) => {
+      if (context) {
+        Object.entries(context).forEach(([key, value]) => {
+          scope.setExtra(key, value);
+        });
+      }
+      Sentry.captureException(error);
+    });
+  },
+
+  // 捕获消息
+  captureMessage: (message: string, level?: Sentry.SeverityLevel) => {
+    Sentry.captureMessage(message, level || 'info');
+  },
+
+  // 手动报告错误
+  reportError: (error: Error, tags?: Record<string, string>) => {
+    Sentry.withScope((scope) => {
+      if (tags) {
+        Object.entries(tags).forEach(([key, value]) => {
+          scope.setTag(key, value);
+        });
+      }
+      scope.setLevel('error');
+      Sentry.captureException(error);
+    });
+  },
+};
+
+// 用户上下文
+export const sentryUser = {
+  // 设置用户信息
+  setUser: (user: { id: string; email?: string; username?: string }) => {
+    Sentry.setUser(user);
+  },
+
+  // 清除用户信息
+  clearUser: () => {
+    Sentry.setUser(null);
+  },
+
+  // 设置用户反馈
+  showReportDialog: (options?: Sentry.ReportDialogOptions) => {
+    Sentry.showReportDialog(options);
+  },
+};
+
+// 自定义标签和上下文
+export const sentryContext = {
+  // 设置标签
+  setTag: (key: string, value: string) => {
+    Sentry.setTag(key, value);
+  },
+
+  // 设置上下文
+  setContext: (key: string, context: Record<string, any>) => {
+    Sentry.setContext(key, context);
+  },
+
+  // 设置额外信息
+  setExtra: (key: string, extra: any) => {
+    Sentry.setExtra(key, extra);
+  },
+};
+
+// ✨ 新增：会话管理
+export const sentrySession = {
+  // 开始用户会话
+  startUserSession: (userId: string, userInfo?: { email?: string; username?: string }) => {
+    // 设置用户信息
+    Sentry.setUser({
+      id: userId,
+      ...userInfo,
+    });
+
+    // 开始会话
+    Sentry.startSession();
+
+    // 添加会话开始的面包屑
+    Sentry.addBreadcrumb({
+      message: `User session started for ${userId}`,
+      category: 'session',
+      level: 'info',
+    });
+  },
+
+  // 结束用户会话
+  endUserSession: () => {
+    Sentry.addBreadcrumb({
+      message: 'User session ended',
+      category: 'session',
+      level: 'info',
+    });
+
+    Sentry.endSession();
+    Sentry.setUser(null);
+  },
+
+  // 记录页面访问（会话活动）
+  recordPageView: (pageName: string, url: string) => {
+    Sentry.addBreadcrumb({
+      message: `Page view: ${pageName}`,
+      category: 'navigation',
+      level: 'info',
+      data: {
+        url,
+        timestamp: new Date().toISOString(),
+      },
+    });
+  },
+
+  // 记录用户操作（保持会话活跃）
+  recordUserAction: (action: string, details?: Record<string, any>) => {
+    Sentry.addBreadcrumb({
+      message: `User action: ${action}`,
+      category: 'user',
+      level: 'info',
+      data: {
+        ...details,
+        timestamp: new Date().toISOString(),
+      },
+    });
+  },
+};

package/dist/templates/utils/sentryDecorators.ts

@@ -0,0 +1,34 @@
+import { sentryPerformance } from './sentry';
+
+// 函数性能监控装饰器
+export function withSentryPerformance(name: string, op = 'function') {
+  return (target: any, propertyKey: string, descriptor: PropertyDescriptor) => {
+    const originalMethod = descriptor.value;
+
+    descriptor.value = sentryPerformance.measureFunction(
+      originalMethod,
+      name,
+      op,
+    );
+
+    return descriptor;
+  };
+}
+
+// 异步函数性能监控装饰器
+export function withSentryAsyncPerformance(
+  name: string,
+  op = 'async_function',
+) {
+  return (target: any, propertyKey: string, descriptor: PropertyDescriptor) => {
+    const originalMethod = descriptor.value;
+
+    descriptor.value = sentryPerformance.measureAsyncFunction(
+      originalMethod,
+      name,
+      op,
+    );
+
+    return descriptor;
+  };
+}

package/dist/templates/utils/updateVersion.ts

@@ -0,0 +1,186 @@
+import { message, notification } from 'antd';
+import React from 'react';
+
+const APP_NAME = process.env.APP_NAME;
+interface IVersionRecord {
+  action: '' | 'refreshedByClick';
+  stack: string[];
+}
+// 对应的数组的key
+const RECORD_KEY = `${APP_NAME}_version_record`;
+
+// 当前版本号
+let CUR_VERSION = '';
+// 页面是否有通知
+let CUR_STATE = false;
+// 是否通过点击通知触发刷新
+let REFRESHED_BY_CLICK = false;
+
+window.addEventListener('beforeunload', () => {
+  if (!REFRESHED_BY_CLICK) {
+    const recordStr = localStorage.getItem(RECORD_KEY);
+    if (recordStr === null) return;
+    const record: IVersionRecord = JSON.parse(recordStr);
+    if (record.action !== '') {
+      record.action = '';
+      localStorage.setItem(RECORD_KEY, JSON.stringify(record));
+    }
+  }
+});
+
+const Interval = {
+  clearInterval: function () {
+    cancelAnimationFrame(this.timer);
+  },
+  setInterval: function (callback: any, interval: any) {
+    let startTime = new Date().valueOf();
+    let endTime = new Date().valueOf();
+    const self: any = this; // eslint-disable-line
+    const loop = () => {
+      self.timer = requestAnimationFrame(loop);
+      endTime = new Date().valueOf();
+      if (endTime - startTime >= interval) {
+        endTime = startTime = new Date().valueOf();
+        callback?.(); // eslint-disable-line
+      }
+    };
+    this.timer = requestAnimationFrame(loop);
+    return this.timer;
+  },
+  timer: 0,
+};
+
+/**
+ * 读取到更新的json文件版本内容
+ */
+const fetchUpdateVersionFile = () => {
+  return new Promise((resolve, reject) => {
+    fetch('/update_version.json')
+      .then(res => {
+        return res.body;
+      })
+      .then(body => {
+        const reader = body?.getReader();
+        if (reader) {
+          reader
+            .read()
+            .then(val => {
+              let str = '';
+              if (val.value) {
+                for (let i = 0; i < val.value.length; i++) {
+                  str += String.fromCharCode(val.value[i]);
+                }
+              }
+              return JSON.parse(str);
+            })
+            .then(json => {
+              resolve(json);
+            })
+            .catch(err => {
+              reject(err);
+            });
+        }
+      })
+      .catch(err => {
+        reject(err);
+      });
+  });
+};
+
+const ENV = process.env.NODE_ENV;
+
+const notifyUserUpdate = () => {
+  const handleClick = () => {
+    REFRESHED_BY_CLICK = true;
+    const recordStr = localStorage.getItem(RECORD_KEY);
+    if (recordStr === null) return;
+    const record: IVersionRecord = JSON.parse(recordStr);
+    record.action = 'refreshedByClick';
+    localStorage.setItem(RECORD_KEY, JSON.stringify(record));
+    window.location.reload();
+  };
+  const handleClose = () => {
+    Interval.clearInterval();
+    message.open({
+      content: '页面将不会提示更新',
+      type: 'warning',
+    });
+  };
+  const openNotification = () => {
+    const element = React.createElement(
+      'div', // 类型
+      {
+        onClick: handleClick,
+        style: { color: '#1677ff', cursor: 'pointer' },
+      }, // 属性
+      '页面已更新，请点击此处刷新页面!', // 子元素
+    );
+    notification.warning({
+      description: element,
+      duration: null,
+      message: '温馨提示',
+      onClose: handleClose,
+      placement: 'bottomRight',
+    });
+  };
+  openNotification();
+  CUR_STATE = true;
+};
+
+const handleMain = (version: string, handleCb: any, fetchDelay: number) => {
+  // 记录当前版本号
+  CUR_VERSION = version;
+  // 从本地获取历史记录
+  const oldVersionRecordStr = localStorage.getItem(RECORD_KEY);
+  // 继承历史记录中的action、stack
+  let oldAction: IVersionRecord['action'] = '';
+  const oldStack: IVersionRecord['stack'] = [version];
+  if (oldVersionRecordStr !== null) {
+    const record: IVersionRecord = JSON.parse(oldVersionRecordStr);
+    oldAction = record.action;
+  }
+  // 创建变量记录版本、操作
+  const curVersionRecord: IVersionRecord = {
+    action: oldAction,
+    stack: oldStack,
+  };
+
+  localStorage.setItem(RECORD_KEY, JSON.stringify(curVersionRecord));
+
+  Interval.setInterval(() => {
+    fetchUpdateVersionFile().then((res: any) => {
+      // 读取版本记录
+      const versionRecordStr = localStorage.getItem(RECORD_KEY);
+      if (typeof versionRecordStr === 'string') {
+        const versionRecord: IVersionRecord = JSON.parse(versionRecordStr);
+        // 读取对应栈
+        const lastVersion = versionRecord.stack[0];
+        localStorage.setItem(RECORD_KEY, JSON.stringify(versionRecord));
+        // 在服务器的版本与当前版本不一致
+        if (res.version !== CUR_VERSION) {
+          if (CUR_STATE === false) {
+            // 发起通知
+            handleCb();
+          } else if (
+            versionRecord.action === 'refreshedByClick' &&
+            lastVersion !== CUR_VERSION
+          ) {
+            // 上一个标签页更新过，且当前标签页未更新
+            REFRESHED_BY_CLICK = true;
+            window.location.reload();
+          }
+        }
+      }
+    });
+  }, fetchDelay);
+};
+
+export const openUpdateVersionNotify = (fetchDelay: number) => {
+  // 开发环境没有必要开启版本检测功能
+  if (ENV === 'development') {
+    return;
+  }
+  fetchUpdateVersionFile().then((res: any) => {
+    handleMain(res.version, notifyUserUpdate, fetchDelay);
+  });
+};

package/dist/templates/volcano.ts

@@ -0,0 +1,66 @@
+import { ColorScaleItem } from '../types';
+
+const volcano: ColorScaleItem = {
+  dark: [
+    '#0c0100',
+    '#2f0a00',
+    '#451200',
+    '#5d1900',
+    '#762000',
+    '#8e2a07',
+    '#a53716',
+    '#bc4424',
+    '#d45132',
+    '#ec5e41',
+    '#ff9480',
+    '#ffcbc3',
+    '#ffffff',
+  ],
+  darkA: [
+    'rgba(240, 20, 0, 0.05)',
+    'rgba(247, 53, 0, 0.19)',
+    'rgba(246, 64, 0, 0.28)',
+    'rgba(251, 68, 0, 0.37)',
+    'rgba(251, 68, 0, 0.47)',
+    'rgba(254, 75, 12, 0.56)',
+    'rgba(254, 85, 34, 0.65)',
+    'rgba(254, 92, 49, 0.74)',
+    'rgba(255, 98, 60, 0.83)',
+    'rgba(254, 101, 70, 0.93)',
+    '#ff9480',
+    '#ffcbc3',
+    '#ffffff',
+  ],
+  light: [
+    '#ffffff',
+    '#fff7f6',
+    '#ffece9',
+    '#ffded9',
+    '#ffcec5',
+    '#ffbbaf',
+    '#ffa695',
+    '#ff8e78',
+    '#fb745a',
+    '#ec5e41',
+    '#a53716',
+    '#5d1900',
+    '#0c0100',
+  ],
+  lightA: [
+    'rgba(255, 255, 255, 0.01)',
+    'rgba(255, 55, 30, 0.04)',
+    'rgba(255, 44, 11, 0.06)',
+    'rgba(255, 35, 2, 0.12)',
+    'rgba(255, 42, 3, 0.20)',
+    'rgba(255, 43, 5, 0.32)',
+    'rgba(255, 43, 3, 0.42)',
+    'rgba(255, 42, 0, 0.53)',
+    'rgba(249, 41, 1, 0.65)',
+    'rgba(230, 40, 2, 0.75)',
+    'rgba(157, 38, 2, 0.92)',
+    '#5d1900',
+    '#0c0100',
+  ],
+};
+
+export default volcano;

package/dist/templates/yellow.ts

@@ -0,0 +1,66 @@
+import { ColorScaleItem } from '../types';
+
+const yellow: ColorScaleItem = {
+  dark: [
+    '#050400',
+    '#251d00',
+    '#3e3300',
+    '#584a00',
+    '#736300',
+    '#8e7d00',
+    '#ab9800',
+    '#c7b426',
+    '#e3d142',
+    '#ffef5c',
+    '#fff594',
+    '#fffad3',
+    '#ffffff',
+  ],
+  darkA: [
+    'rgba(250, 200, 0, 0.02)',
+    'rgba(247, 193, 0, 0.15)',
+    'rgba(248, 204, 0, 0.25)',
+    'rgba(251, 211, 0, 0.35)',
+    'rgba(250, 215, 0, 0.46)',
+    'rgba(254, 223, 0, 0.56)',
+    'rgba(255, 227, 0, 0.67)',
+    'rgba(255, 231, 49, 0.78)',
+    'rgba(255, 235, 74, 0.89)',
+    '#ffef5c',
+    '#fff594',
+    '#fffad3',
+    '#ffffff',
+  ],
+  light: [
+    '#ffffff',
+    '#fffeff',
+    '#fffcff',
+    '#fffbf1',
+    '#fffada',
+    '#fff9c2',
+    '#fff7aa',
+    '#fff592',
+    '#fff279',
+    '#ffef5c',
+    '#ab9800',
+    '#584a00',
+    '#050400',
+  ],
+  lightA: [
+    'rgba(255, 255, 255, 0.01)',
+    'rgba(255, 155, 255, 0.01)',
+    'rgba(255, 105, 255, 0.02)',
+    'rgba(255, 188, 22, 0.06)',
+    'rgba(255, 222, 8, 0.15)',
+    'rgba(255, 230, 1, 0.24)',
+    'rgba(255, 231, 5, 0.34)',
+    'rgba(255, 232, 2, 0.43)',
+    'rgba(255, 230, 2, 0.53)',
+    'rgba(255, 230, 0, 0.64)',
+    '#ab9800',
+    '#584a00',
+    '#050400',
+  ],
+};
+
+export default yellow;