create-secra 0.1.0 → 0.1.2

package/template/packages/sdk/package.json

@@ -0,0 +1,32 @@
+{
+  "name": "@vlian/sdk",
+  "version": "1.0.2",
+  "description": "",
+  "main": "dist/index.js",
+  "type": "module",
+  "types": "dist/types/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/types/index.d.ts",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
+    },
+    "./request": {
+      "types": "./dist/types/request/index.d.ts",
+      "import": "./dist/request/index.js",
+      "default": "./dist/request/index.js"
+    },
+    "./reset.css": "./dist/styles/reset.css"
+  },
+  "scripts": {
+    "build": "pnpm run build:js && pnpm run build:types && pnpm run build:assets",
+    "build:js": "swc src -d dist --config-file .swcrc --source-maps --strip-leading-paths",
+    "build:types": "tsc -p tsconfig.json --emitDeclarationOnly --declaration --declarationMap --outDir dist/types",
+    "build:assets": "mkdir -p dist/styles && cp src/styles/reset.css dist/styles/reset.css"
+  },
+  "devDependencies": {
+    "@swc/cli": "^0.7.3",
+    "@swc/core": "^1.13.5"
+  },
+  "private": true
+}

package/template/packages/sdk/src/build/index.ts

@@ -0,0 +1,33 @@
+/**
+ * @react-plugins/build
+ * 构建工具和配置共享包
+ * 
+ * 提供统一的 Vite 插件配置，供 Monorepo 中所有应用使用
+ */
+
+// 导出版本
+export const version = '0.0.1';
+
+// 插件导出
+export { setupAutoImport } from './plugins/auto-import.js';
+export { setupUnocss } from './plugins/unocss.js';
+export { setupUnPluginIcon } from './plugins/unplugin-icon.js';
+export { setupRemoveConsole } from './plugins/remove-console.js';
+export { setupBundleAnalyzer } from './plugins/bundle-analyzer.js';
+
+// 工具导出
+export { default as Inspect } from 'vite-plugin-inspect';
+export { default as removeConsole } from 'vite-plugin-remove-console';
+
+// 依赖优化列表（用于 optimizeDeps.include）
+export const include = [
+  'ahooks',
+  'i18next',
+  'lodash',
+  'immer',
+  'react-i18next',
+] as const;
+
+// 类型导出
+export type { Plugin } from 'vite';
+export type { UserConfig } from '@unocss/core';

package/template/packages/sdk/src/build/plugins/auto-import.ts

@@ -0,0 +1,47 @@
+import AutoImport from 'unplugin-auto-import/vite';
+import IconsResolver from 'unplugin-icons/resolver';
+import type { Plugin } from 'vite';
+
+/**
+ * 自动导入配置
+ *
+ * 功能：
+ * - 自动导入 React、React Router、ahooks 等常用库
+ * - 自动导入图标组件
+ * - 自动导入自定义 hooks 和组件
+ */
+export function setupAutoImport(): Plugin | Plugin[] {
+    return AutoImport({
+      // 扫描目录，自动导入 hooks 和组件
+      dirs: ['src/hooks/**', 'src/components/**'],
+
+      // 自动导入类型声明文件
+      dts: 'src/types/auto-imports.d.ts',
+
+      // 自动导入的库
+      imports: [
+        'react',
+        'react-router-dom',
+        'react-i18next',
+        'ahooks',
+        // React 类型导入
+        { from: 'react', imports: ['FC', 'ReactNode', 'ComponentType'], type: true },
+      ],
+
+      // 匹配的文件
+      include: [/\.[tj]sx?$/],
+
+      // 排除的文件（排除文档文件和其他非代码文件）
+      exclude: [/\.md$/, /\.d\.ts$/, /\.test\.(ts|tsx)$/, /\.spec\.(ts|tsx)$/],
+
+      // 解析器
+      resolvers: [
+        // 图标解析器
+        IconsResolver({
+          customCollections: ['local'],
+          extension: 'tsx',
+          prefix: 'icon',
+        }),
+      ],
+    });
+  }

package/template/packages/sdk/src/build/plugins/bundle-analyzer.ts

@@ -0,0 +1,35 @@
+import { visualizer } from 'rollup-plugin-visualizer';
+import type { Plugin } from 'vite';
+
+/**
+ * 打包分析插件
+ * 
+ * 功能：
+ * - 生成打包分析报告
+ * - 可视化 bundle 大小
+ * - 帮助优化打包体积
+ * 
+ * @param options - 配置选项
+ * @returns Vite 插件
+ */
+export function setupBundleAnalyzer(options?: {
+  /** 输出文件名（默认: stats.html） */
+  filename?: string;
+  /** 是否自动打开浏览器 */
+  open?: boolean;
+  /** 输出格式（默认: html） */
+  template?: 'treemap' | 'sunburst' | 'network';
+  /** 是否 gzip 压缩 */
+  gzipSize?: boolean;
+  /** 是否 brotli 压缩 */
+  brotliSize?: boolean;
+}): Plugin | Plugin[] {
+  return visualizer({
+    filename: options?.filename || 'dist/stats.html',
+    open: options?.open ?? true,
+    template: options?.template || 'treemap',
+    gzipSize: options?.gzipSize ?? true,
+    brotliSize: options?.brotliSize ?? true,
+  }) as Plugin;
+}
+

package/template/packages/sdk/src/build/plugins/remove-console.ts

@@ -0,0 +1,21 @@
+import removeConsole from 'vite-plugin-remove-console';
+import type { Plugin } from 'vite';
+
+/**
+ * 移除 console 插件
+ *
+ * 功能：
+ * - 生产环境自动移除 console 语句
+ * - 提升生产环境性能
+ *
+ * @param options - 配置选项
+ * @returns Vite 插件
+ */
+export function setupRemoveConsole(options?: {
+  /** 需要移除的 console 方法 */
+  include?: string[];
+}): Plugin | Plugin[] {
+  return removeConsole({
+    external: options?.include || ['log', 'info', 'debug', 'warn'],
+  }) as Plugin | Plugin[];
+}

package/template/packages/sdk/src/build/plugins/unocss.ts

@@ -0,0 +1,110 @@
+import { FileSystemIconLoader } from '@iconify/utils/lib/loader/node-loaders';
+import presetAttributify from '@unocss/preset-attributify';
+import presetIcons from '@unocss/preset-icons';
+import presetUno from '@unocss/preset-uno';
+import transformerDirectives from '@unocss/transformer-directives';
+import transformerVariantGroup from '@unocss/transformer-variant-group';
+import unocss from '@unocss/vite';
+import type { UserConfig } from '@unocss/core';
+
+/**
+ * UnoCSS 配置
+ * 
+ * 功能：
+ * - 集成 UnoCSS
+ * - 支持本地 SVG 图标
+ * - 包含完整的预设和转换器
+ * - 支持属性化模式（Attributify）
+ * 
+ * @param localIconPath - 本地图标路径
+ * @param unocssConfig - UnoCSS 配置（可选，用于合并其他配置）
+ */
+export function setupUnocss(
+  localIconPath: string,
+  unocssConfig?: Partial<UserConfig>
+): ReturnType<typeof unocss> {
+  return unocss({
+    presets: [
+      // 基础预设 - 包含 Tailwind CSS 兼容的工具类
+      presetUno(),
+      // 属性化模式 - 支持 <div bg="blue-400" /> 语法
+      presetAttributify(),
+      // 图标预设 - 支持本地 SVG 图标
+      presetIcons({
+        collections: {
+          // 本地图标集合
+          local: FileSystemIconLoader(localIconPath, (svg) =>
+            svg.replace(/^<svg\s/, '<svg width="1em" height="1em" ')
+          ),
+        },
+        extraProperties: {
+          display: 'inline-block',
+        },
+        prefix: 'icon-',
+        scale: 1,
+        warn: true,
+      }),
+    ],
+    // 转换器
+    transformers: [
+      transformerDirectives(), // 支持 @apply、@screen 等指令
+      transformerVariantGroup(), // 支持 variant groups (hover:bg-gray-400 hover:text-white)
+    ],
+    // 主题配置
+    theme: {
+      colors: {},
+      breakpoints: {
+        xs: '320px',
+        sm: '640px',
+        md: '768px',
+        lg: '1024px',
+        xl: '1280px',
+        '2xl': '1536px',
+      },
+    },
+    // 快捷方式 - 组合多个工具类
+    shortcuts: {
+      // 按钮样式
+      'btn': 'px-4 py-2 rounded font-semibold transition-colors duration-200',
+      'btn-primary': 'btn bg-primary-500 text-white hover:bg-primary-600 active:bg-primary-700',
+      'btn-secondary': 'btn bg-gray-500 text-white hover:bg-gray-600 active:bg-gray-700',
+      'btn-success': 'btn bg-success-500 text-white hover:bg-success-600 active:bg-success-700',
+      'btn-warning': 'btn bg-warning-500 text-white hover:bg-warning-600 active:bg-warning-700',
+      'btn-error': 'btn bg-error-500 text-white hover:bg-error-600 active:bg-error-700',
+      'btn-outline': 'btn border-2 bg-transparent hover:bg-gray-100',
+      'btn-ghost': 'btn bg-transparent hover:bg-gray-100',
+      // 容器样式
+      'container': 'mx-auto px-4 sm:px-6 lg:px-8',
+      'container-sm': 'mx-auto px-4 sm:px-6 max-w-screen-sm',
+      'container-md': 'mx-auto px-4 sm:px-6 max-w-screen-md',
+      'container-lg': 'mx-auto px-4 sm:px-6 max-w-screen-lg',
+      'container-xl': 'mx-auto px-4 sm:px-6 max-w-screen-xl',
+      // 卡片样式
+      'card': 'bg-white rounded-lg shadow-sm border border-gray-200',
+      'card-header': 'px-6 py-4 border-b border-gray-200',
+      'card-body': 'px-6 py-4',
+      'card-footer': 'px-6 py-4 border-t border-gray-200',
+      // 输入框样式
+      'input': 'px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent',
+      'input-error': 'input border-error-500 focus:ring-error-500',
+      // 布局样式
+      'flex-center': 'flex items-center justify-center',
+      'flex-between': 'flex items-center justify-between',
+      'flex-start': 'flex items-center justify-start',
+      'flex-end': 'flex items-center justify-end',
+    },
+    // 自定义规则
+    rules: [
+      // 可以在这里添加项目特定的工具类
+      // 示例：['custom-rule', { color: 'red' }],
+    ],
+    // 安全列表 - 确保这些类名始终被生成（即使没有被扫描到）
+    safelist: [
+      // 可以添加动态生成的类名
+      // 例如：'bg-red-500', 'bg-blue-500',
+      // 或者使用正则：/^bg-(red|blue|green)-\d+$/,
+    ],
+    // 合并用户自定义配置（会覆盖上面的默认配置）
+    ...unocssConfig,
+  });
+}

package/template/packages/sdk/src/build/plugins/unplugin-icon.ts

@@ -0,0 +1,43 @@
+import { FileSystemIconLoader } from 'unplugin-icons/loaders';
+import Icons from 'unplugin-icons/vite';
+import { createSvgIconsPlugin } from 'vite-plugin-svg-icons';
+
+/**
+ * 图标插件配置
+ * 
+ * 功能：
+ * - SVG 图标支持（vite-plugin-svg-icons）
+ * - 图标组件自动导入（unplugin-icons）
+ * - 支持本地 SVG 图标
+ * 
+ * @param localIconPath - 本地图标路径
+ * @param customDomId - 自定义 DOM ID（默认: __SVG_ICON_LOCAL__）
+ * @returns 插件数组
+ */
+export function setupUnPluginIcon(
+  localIconPath: string,
+  customDomId = '__SVG_ICON_LOCAL__'
+): Array<ReturnType<typeof createSvgIconsPlugin> | ReturnType<typeof Icons>> {
+  return [
+    // SVG 图标插件 - 用于 <svg><use xlink:href="#icon-local-xxx" /></svg> 方式
+    createSvgIconsPlugin({
+      customDomId,
+      iconDirs: [localIconPath],
+      inject: 'body-last',
+      symbolId: 'icon-local-[dir]-[name]',
+    }),
+    
+    // 图标组件插件 - 用于 <IconLocalXxx /> 组件方式
+    Icons({
+      compiler: 'jsx',
+      customCollections: {
+        local: FileSystemIconLoader(localIconPath, (svg) =>
+          svg.replace(/^<svg\s/, '<svg width="1em" height="1em" ')
+        ),
+      },
+      defaultClass: 'inline-block',
+      jsx: 'react',
+      scale: 1,
+    }),
+  ];
+}

package/template/packages/sdk/src/index.ts

@@ -0,0 +1 @@
+export * from "./build/index.js";

package/template/packages/sdk/src/request/index.ts

@@ -0,0 +1,341 @@
+import {
+  RequestClient,
+  RequestError,
+  RequestErrorCode,
+  RequestErrorType,
+  type RequestBody,
+  type RequestHeaders,
+  type RequestOptions,
+  type RequestQuery,
+  type Response,
+  kyAdapter,
+  axiosAdapter,
+  PluginPriority,
+  type RequestPlugin,
+  type RequestClientConfig,
+} from "@vlian/framework/request";
+
+export interface ApiResponse<T = unknown> {
+  data: T;
+  code: number;
+  message: string;
+}
+
+export interface SdkRequestMeta extends Record<string, unknown> {
+  /** Disable default error message prompt. */
+  silent?: boolean;
+  /** Explicitly control error message prompt. */
+  showErrorMessage?: boolean;
+}
+
+export interface SdkRequestOptions<TResponse = unknown>
+  extends Omit<RequestOptions<TResponse>, "body" | "query" | "_responseType"> {
+  data?: RequestBody;
+  params?: RequestQuery;
+  meta?: SdkRequestMeta;
+  body?: RequestBody;
+  query?: RequestQuery;
+  _responseType?: SdkResponse<TResponse>;
+}
+
+export interface SdkResponse<T = unknown> {
+  data: T | undefined;
+  code: number;
+  message: string;
+  headers: RequestHeaders;
+  raw: unknown;
+  status: number;
+  error: boolean;
+  version: string;
+}
+
+const DEFAULT_MESSAGE = "消息提示";
+const RESPONSE_VERSION = "1.0.0";
+export const SDK_REQUEST_VERSION = RESPONSE_VERSION;
+
+const getMessageHandler = (): ((message: string) => void) | null => {
+  if (typeof window === "undefined") {
+    return null;
+  }
+  const message = (window as unknown as { $message?: { error?: (msg: string) => void } })
+    .$message;
+  if (message && typeof message.error === "function") {
+    return message.error.bind(message);
+  }
+  return null;
+};
+
+const extractMessage = (payload: unknown): string | undefined => {
+  if (!payload || typeof payload !== "object") {
+    return undefined;
+  }
+  if ("error" in payload) {
+    const errorPayload = (payload as { error?: unknown }).error;
+    const errorMessage = extractMessage(errorPayload);
+    if (errorMessage) {
+      return errorMessage;
+    }
+  }
+  if ("message" in payload && typeof (payload as { message?: unknown }).message === "string") {
+    return (payload as { message: string }).message;
+  }
+  return undefined;
+};
+
+const extractErrorPayload = (error: RequestError): unknown => {
+  if (error.response?.data) {
+    return error.response.data;
+  }
+  const cause = error.cause as { response?: { data?: unknown } } | undefined;
+  if (cause?.response?.data) {
+    return cause.response.data;
+  }
+  return undefined;
+};
+
+const normalizeResponse = <T>(payload: unknown, status: number): ApiResponse<T> => {
+  const objectPayload = payload && typeof payload === "object" ? (payload as Record<string, unknown>) : undefined;
+  const hasEnvelope =
+    !!objectPayload && ("code" in objectPayload || "message" in objectPayload || "data" in objectPayload);
+  const data =
+    objectPayload && "data" in objectPayload
+      ? (objectPayload.data as T)
+      : (hasEnvelope ? (undefined as T) : (payload as T));
+  const codeValue = objectPayload && "code" in objectPayload ? objectPayload.code : status === 200 ? 0 : status;
+  const code = typeof codeValue === "number" ? codeValue : Number(codeValue || 0);
+  const message =
+    (objectPayload && typeof objectPayload.message === "string" && objectPayload.message) ||
+    DEFAULT_MESSAGE;
+  return {
+    data,
+    code,
+    message,
+  };
+};
+
+const createDefaultResponsePlugin = (): RequestPlugin => ({
+  name: "sdk-default-response",
+  priority: PluginPriority.HIGH,
+  onAfterRequest(context) {
+    const response = context.response as Response<unknown> | undefined;
+    if (!response) {
+      return;
+    }
+    const normalized = normalizeResponse(response.data, response.status);
+    const isSuccess = response.status === 200 && normalized.code === 0;
+    const transformed: SdkResponse<unknown> = {
+      data: normalized.data as unknown,
+      code: normalized.code,
+      message: normalized.message,
+      raw: response.raw,
+      headers: response.headers || {},
+      status: response.status,
+      error: !isSuccess,
+      version: RESPONSE_VERSION,
+    };
+    const mergedResponse = {
+      ...response,
+      data: transformed,
+    } as Response<SdkResponse<unknown>>;
+
+    if (isSuccess) {
+      return mergedResponse;
+    }
+
+    throw new RequestError(
+      normalized.message || `HTTP ${response.status} 错误`,
+      response.status === 200 ? RequestErrorType.UNKNOWN_ERROR : RequestErrorType.HTTP_ERROR,
+      response.status >= 500 ? RequestErrorCode.SERVER_ERROR : RequestErrorCode.CLIENT_ERROR,
+      {
+        status: response.status,
+        response: mergedResponse,
+      },
+    );
+  },
+  onError(context) {
+    const { error, request } = context;
+    if (!error || !request) {
+      return;
+    }
+    const meta = (request.meta || {}) as SdkRequestMeta;
+    if (meta.silent === true || meta.showErrorMessage === false) {
+      return;
+    }
+    if (error.type === RequestErrorType.ABORT_ERROR) {
+      return;
+    }
+    let message = error.message || "请求失败";
+    if (error.type === RequestErrorType.NETWORK_ERROR) {
+      message = "网络连接失败，请检查网络";
+    } else if (error.type === RequestErrorType.TIMEOUT_ERROR) {
+      message = "请求超时，请稍后重试";
+    } else {
+      const payload = extractErrorPayload(error);
+      if (payload) {
+        message = extractMessage(payload) || message;
+      }
+    }
+
+    const handler = getMessageHandler();
+    if (handler) {
+      handler(message);
+    } else if (typeof console !== "undefined") {
+      console.error(message);
+    }
+  },
+});
+
+const mapRequestOptions = <T>(options: SdkRequestOptions<T>): RequestOptions<SdkResponse<T>> => ({
+  ...options,
+  body: options.body ?? options.data,
+  query: options.query ?? options.params,
+  meta: options.meta as Record<string, unknown> | undefined,
+});
+
+class SdkRequestClient {
+  private client: RequestClient;
+  private initPromise?: Promise<void>;
+
+  constructor(config: RequestClientConfig) {
+    this.client = new RequestClient(config);
+  }
+
+  private async ensureInitialized() {
+    if (!this.initPromise) {
+      this.initPromise = this.client.initialize();
+    }
+    await this.initPromise;
+  }
+
+  async request<TResponse = unknown>(
+    options: SdkRequestOptions<TResponse>,
+  ): Promise<SdkResponse<TResponse>> {
+    await this.ensureInitialized();
+    const response = await this.client.request<unknown>(mapRequestOptions(options));
+    const payload = response.data as SdkResponse<TResponse> | Record<string, unknown> | null | undefined;
+    if (payload && typeof payload === "object" && "version" in payload) {
+      return payload as SdkResponse<TResponse>;
+    }
+    const normalized = normalizeResponse<TResponse>(response.data, response.status);
+    const isSuccess = response.status === 200 && normalized.code === 0;
+    return {
+      data: normalized.data as TResponse,
+      code: normalized.code,
+      message: normalized.message,
+      headers: response.headers || {},
+      raw: response.raw,
+      status: response.status,
+      error: !isSuccess,
+      version: RESPONSE_VERSION,
+    };
+  }
+
+  async get<TResponse = unknown>(
+    urlOrOptions: string | SdkRequestOptions<TResponse>,
+    options?: SdkRequestOptions<TResponse>,
+  ): Promise<SdkResponse<TResponse>> {
+    if (typeof urlOrOptions === "string") {
+      return this.request({
+        ...(options || {}),
+        url: urlOrOptions,
+        method: "GET",
+      });
+    }
+    return this.request({
+      ...urlOrOptions,
+      method: "GET",
+    });
+  }
+
+  async post<TResponse = unknown>(
+    urlOrOptions: string | SdkRequestOptions<TResponse>,
+    data?: RequestBody,
+    options?: SdkRequestOptions<TResponse>,
+  ): Promise<SdkResponse<TResponse>> {
+    if (typeof urlOrOptions === "string") {
+      return this.request({
+        ...(options || {}),
+        url: urlOrOptions,
+        method: "POST",
+        data,
+      });
+    }
+    return this.request({
+      ...urlOrOptions,
+      method: "POST",
+    });
+  }
+
+  async put<TResponse = unknown>(
+    urlOrOptions: string | SdkRequestOptions<TResponse>,
+    data?: RequestBody,
+    options?: SdkRequestOptions<TResponse>,
+  ): Promise<SdkResponse<TResponse>> {
+    if (typeof urlOrOptions === "string") {
+      return this.request({
+        ...(options || {}),
+        url: urlOrOptions,
+        method: "PUT",
+        data,
+      });
+    }
+    return this.request({
+      ...urlOrOptions,
+      method: "PUT",
+    });
+  }
+
+  async patch<TResponse = unknown>(
+    urlOrOptions: string | SdkRequestOptions<TResponse>,
+    data?: RequestBody,
+    options?: SdkRequestOptions<TResponse>,
+  ): Promise<SdkResponse<TResponse>> {
+    if (typeof urlOrOptions === "string") {
+      return this.request({
+        ...(options || {}),
+        url: urlOrOptions,
+        method: "PATCH",
+        data,
+      });
+    }
+    return this.request({
+      ...urlOrOptions,
+      method: "PATCH",
+    });
+  }
+
+  async delete<TResponse = unknown>(
+    urlOrOptions: string | SdkRequestOptions<TResponse>,
+    options?: SdkRequestOptions<TResponse>,
+  ): Promise<SdkResponse<TResponse>> {
+    if (typeof urlOrOptions === "string") {
+      return this.request({
+        ...(options || {}),
+        url: urlOrOptions,
+        method: "DELETE",
+      });
+    }
+    return this.request({
+      ...urlOrOptions,
+      method: "DELETE",
+    });
+  }
+
+  async setAdapter(adapter: string | (() => Promise<unknown>)) {
+    await this.ensureInitialized();
+    // @ts-expect-error - adapter type is ensured by request client
+    await this.client.setAdapter(adapter);
+  }
+}
+
+export const platformRequestClient = new SdkRequestClient({
+  defaultAdapter: kyAdapter,
+  plugins: [createDefaultResponsePlugin()],
+});
+
+export const uploadRequestClient = new SdkRequestClient({
+  defaultAdapter: axiosAdapter,
+  plugins: [createDefaultResponsePlugin()],
+});
+
+export const createSdkRequestPlugin = createDefaultResponsePlugin;