generator-mico-cli 0.2.30 → 0.2.32

package/generators/h5-react/templates/packages/utils/src/mock.ts

@@ -0,0 +1,83 @@
+import http from 'http';
+import httpProxy from 'http-proxy';
+import { ZodSchema } from 'zod';
+
+export const baseUrl = (() => {
+  const apiBaseUrl = process.env.UMI_APP_API_BASE_URL ?? '';
+  if (apiBaseUrl.endsWith('/')) {
+    return apiBaseUrl.slice(0, -1);
+  }
+  return apiBaseUrl;
+})();
+
+const isHttpProxy = (url: string | null) => {
+  if (!url) {
+    return false;
+  }
+  return /^https?:\/\//.test(url);
+};
+
+const proxyRequest = async (
+  remote: string,
+  req: http.IncomingMessage,
+  res: http.ServerResponse,
+) => {
+  const body = req.body as Record<string, unknown>;
+  const proxy = httpProxy.createProxyServer();
+  proxy.on('proxyReq', (proxyReq, req) => {
+    if (!body) {
+      return;
+    }
+    const bodyJson = JSON.stringify(body);
+    proxyReq.setHeader('Content-Type', req.headers['content-type'] ?? '');
+    proxyReq.setHeader(
+      'Content-Length',
+      Buffer.byteLength(bodyJson).toString(),
+    );
+    proxyReq.write(bodyJson);
+  });
+  req.url = req.url!.replace(baseUrl, '');
+  proxy.web(req, res, {
+    target: remote,
+    changeOrigin: true,
+  });
+};
+
+/**
+ * 如果检测到 remote 代理参数，则透传请求并返回 true；否则返回 false 走 mock 逻辑。
+ */
+export const tryProxy = async (
+  req: http.IncomingMessage,
+  res: http.ServerResponse,
+) => {
+  const referer = req.headers.referer;
+  if (referer) {
+    const url = new URL(referer);
+    const remote = url.searchParams.get('remote');
+    if (remote && isHttpProxy(remote)) {
+      await proxyRequest(remote, req, res);
+      return true;
+    }
+  }
+  return false;
+};
+
+/**
+ * 校验请求体，失败时自动返回 400 响应。
+ * 返回 true 表示校验通过，false 表示已响应错误。
+ */
+export const validateBody = (
+  body: unknown,
+  schema: ZodSchema,
+  res: http.ServerResponse,
+): boolean => {
+  const result = schema.safeParse(body);
+  if (!result.success) {
+    const message = result.error.issues
+      .map((issue) => `${issue.path.join('.')}: ${issue.message}`)
+      .join('\n');
+    res.status(400).json({ code: 400, message });
+    return false;
+  }
+  return true;
+};

package/generators/h5-react/templates/packages/utils/src/number.ts

@@ -0,0 +1,23 @@
+const defaultFormatter = new Intl.NumberFormat('en-US');
+
+/**
+ * 格式化数字
+ * @param number 数字
+ * @returns 格式化后的数字
+ */
+export function formatNumber(
+  value: number | bigint,
+  options?: Intl.NumberFormatOptions,
+  locale: string | string[] = 'en-US',
+) {
+  if (value == null || (typeof value === 'number' && !Number.isFinite(value))) {
+    return '';
+  }
+  if (
+    !options &&
+    (locale === 'en-US' || (Array.isArray(locale) && locale[0] === 'en-US'))
+  ) {
+    return defaultFormatter.format(value);
+  }
+  return new Intl.NumberFormat(locale, options).format(value);
+}

package/generators/h5-react/templates/packages/utils/src/tailwind.ts

@@ -0,0 +1,12 @@
+import { clsx, type ClassValue } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+export * from 'class-variance-authority';
+
+/**
+ * 合并 Tailwind 类名并解决冲突
+ * @param inputs 类名
+ * @returns 合并后的类名
+ */
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs));
+}

package/generators/h5-react/templates/packages/utils/src/url.ts

@@ -0,0 +1,19 @@
+/**
+ * 获取URL参数
+ * @param url
+ * @returns URL参数对象
+ */
+export function getURLParams(url: string = window.location.href) {
+  const urlObject = new URL(url);
+  return urlObject.searchParams;
+}
+
+/**
+ * 格式化URL
+ * @param url
+ * @returns 格式化后的URL
+ */
+export function formatURL(url: string) {
+  const urlObject = new URL(url, location.origin);
+  return urlObject.toString();
+}

package/generators/h5-react/templates/packages/utils/tsconfig.json

@@ -0,0 +1,9 @@
+{
+  "extends": "<%= packageScope %>/typescript",
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "<%= packageScope %>/utils/*": ["./src/*"]
+    }
+  }
+}

package/generators/h5-react/templates/page.config.ts

@@ -0,0 +1 @@
+export default {};

package/generators/h5-react/templates/pnpm-workspace.yaml

@@ -0,0 +1,17 @@
+packages:
+  - apps/*
+  - packages/*
+
+catalog:
+  umi: ^4
+  react: ^18
+  react-dom: ^18
+  "@types/react": ^18
+  "@types/react-dom": ^18
+  tailwindcss: ^3
+  tailwindcss-safe-area: 0.8.0
+  "@umijs/plugins": ^4
+  eslint: ^9
+  stylelint: ^14
+  cross-env: "*"
+  "@common-web/sentry": "^0.0.4"

package/generators/h5-react/templates/scripts/collect-dist.js

@@ -0,0 +1,78 @@
+#!/usr/bin/env node
+const fs = require('node:fs/promises');
+const path = require('node:path');
+
+/**
+ * 收集所有子应用的构建产物到根目录的 dist 目录
+ * 将 apps/{app}/dist 移动到 dist/{app}/
+ */
+async function collectDist() {
+  const rootDir = path.resolve(__dirname, '..');
+  const appsDir = path.join(rootDir, 'apps');
+  const distDir = path.join(rootDir, 'dist');
+
+  try {
+    // 确保根目录的 dist 目录存在
+    await fs.mkdir(distDir, { recursive: true });
+
+    // 读取 apps 目录下的所有子目录
+    const entries = await fs.readdir(appsDir, { withFileTypes: true });
+    const apps = entries.filter((entry) => entry.isDirectory());
+
+    if (apps.length === 0) {
+      console.log('未找到任何子应用');
+      return;
+    }
+
+    console.log('开始收集构建产物...\n');
+
+    for (const app of apps) {
+      const appName = app.name;
+      const appDistPath = path.join(appsDir, appName, 'dist');
+      const targetDistPath = path.join(distDir, appName);
+
+      try {
+        // 检查源 dist 目录是否存在
+        const stat = await fs.stat(appDistPath);
+        if (!stat.isDirectory()) {
+          console.log(`跳过 ${appName}: dist 不是目录`);
+          continue;
+        }
+
+        // 检查目标目录是否已存在，如果存在则先删除
+        try {
+          await fs.rm(targetDistPath, { recursive: true, force: true });
+        } catch {
+          // 忽略删除错误
+        }
+
+        // 移动 dist 目录到目标位置
+        await fs.rename(appDistPath, targetDistPath);
+
+        // 删除 .map 文件（sourcemap 已由 webpack 插件上传到 Sentry，无需部署到 CDN）
+        const files = await fs.readdir(targetDistPath);
+        for (const file of files) {
+          if (file.endsWith('.map')) {
+            await fs.unlink(path.join(targetDistPath, file));
+            console.log(`  🗑 已删除 sourcemap: ${appName}/${file}`);
+          }
+        }
+
+        console.log(`✓ ${appName}: apps/${appName}/dist -> dist/${appName}/`);
+      } catch (error) {
+        if (error.code === 'ENOENT') {
+          console.log(`跳过 ${appName}: 未找到 dist 目录`);
+        } else {
+          console.error(`处理 ${appName} 时出错: ${error.message}`);
+        }
+      }
+    }
+
+    console.log('\n构建产物收集完成！');
+  } catch (error) {
+    console.error(`收集构建产物失败: ${error.message}`);
+    process.exit(1);
+  }
+}
+
+collectDist();

package/generators/h5-react/templates/scripts/dev-preset.js

@@ -0,0 +1,265 @@
+#!/usr/bin/env node
+/**
+ * 多应用并行启动脚本
+ *
+ * 用法:
+ *   pnpm dev:preset              # 使用默认预设
+ *   pnpm dev:preset <preset>     # 使用指定预设
+ *   pnpm dev:preset --list       # 列出所有预设
+ *   pnpm dev:preset --config     # 显示配置文件路径
+ */
+const fs = require('node:fs/promises');
+const path = require('node:path');
+const { spawn } = require('node:child_process');
+
+const CONFIG_FILE = 'dev.preset.json';
+const ROOT_DIR = path.resolve(__dirname, '..');
+const APPS_DIR = path.join(ROOT_DIR, 'apps');
+
+// 颜色代码
+const colors = {
+  reset: '\x1b[0m',
+  cyan: '\x1b[36m',
+  yellow: '\x1b[33m',
+  green: '\x1b[32m',
+  red: '\x1b[31m',
+  gray: '\x1b[90m',
+  magenta: '\x1b[35m',
+  blue: '\x1b[34m',
+};
+
+// 为不同应用分配不同颜色
+const appColors = [
+  '\x1b[36m', // cyan
+  '\x1b[33m', // yellow
+  '\x1b[32m', // green
+  '\x1b[35m', // magenta
+  '\x1b[34m', // blue
+  '\x1b[91m', // bright red
+  '\x1b[92m', // bright green
+  '\x1b[93m', // bright yellow
+];
+
+async function loadConfig() {
+  const configPath = path.join(ROOT_DIR, CONFIG_FILE);
+  try {
+    const raw = await fs.readFile(configPath, 'utf8');
+    return JSON.parse(raw);
+  } catch (error) {
+    if (error.code === 'ENOENT') {
+      console.error(`${colors.red}错误: 未找到配置文件 ${CONFIG_FILE}${colors.reset}`);
+      console.error(`${colors.gray}请在项目根目录创建 ${CONFIG_FILE} 文件${colors.reset}`);
+      process.exit(1);
+    }
+    throw error;
+  }
+}
+
+async function collectApps() {
+  const entries = await fs.readdir(APPS_DIR, { withFileTypes: true });
+  const apps = [];
+  for (const entry of entries) {
+    if (!entry.isDirectory()) continue;
+    const pkgPath = path.join(APPS_DIR, entry.name, 'package.json');
+    try {
+      const pkgRaw = await fs.readFile(pkgPath, 'utf8');
+      const pkgJson = JSON.parse(pkgRaw);
+      if (pkgJson?.scripts?.dev) {
+        apps.push(entry.name);
+      }
+    } catch {
+      // ignore
+    }
+  }
+  return apps;
+}
+
+async function resolveDotenvCli() {
+  const pnpmVirtualStore = path.join(ROOT_DIR, 'node_modules', '.pnpm');
+  let entries;
+  try {
+    entries = await fs.readdir(pnpmVirtualStore);
+  } catch {
+    throw new Error('未找到 pnpm 虚拟模块目录，请先执行 pnpm install');
+  }
+  const match = entries.find((entry) => entry.startsWith('dotenv-cli@'));
+  if (!match) {
+    throw new Error('未安装 dotenv-cli，请执行 pnpm install');
+  }
+  return path.join(pnpmVirtualStore, match, 'node_modules', 'dotenv-cli', 'cli.js');
+}
+
+function listPresets(config) {
+  console.log(`\n${colors.cyan}可用的预设列表:${colors.reset}\n`);
+
+  const defaultPreset = config.default;
+  for (const [name, preset] of Object.entries(config.presets)) {
+    const isDefault = name === defaultPreset;
+    const marker = isDefault ? ` ${colors.green}(默认)${colors.reset}` : '';
+    const desc = preset.description || '';
+    console.log(`  ${colors.yellow}${name}${colors.reset}${marker}`);
+    if (desc) {
+      console.log(`    ${colors.gray}${desc}${colors.reset}`);
+    }
+    console.log(`    ${colors.gray}应用: ${preset.apps.join(', ')}${colors.reset}`);
+    console.log();
+  }
+
+  console.log(`${colors.gray}使用方式: pnpm dev:preset <预设名>${colors.reset}`);
+  console.log(`${colors.gray}配置文件: ${CONFIG_FILE}${colors.reset}\n`);
+}
+
+function printBanner(presetName, apps) {
+  const title = `dev:preset [${presetName}]`;
+  const appList = apps.join(', ');
+  console.log(`
+${colors.cyan}╭${'─'.repeat(Math.max(title.length, appList.length) + 10)}╮
+│  🚀 ${title.padEnd(Math.max(title.length, appList.length) + 5)}│
+│  📦 ${appList.padEnd(Math.max(title.length, appList.length) + 5)}│
+╰${'─'.repeat(Math.max(title.length, appList.length) + 10)}╯${colors.reset}
+`);
+}
+
+function createPrefixedStream(appName, color, stream) {
+  const prefix = `${color}[${appName}]${colors.reset} `;
+  let buffer = '';
+
+  return (chunk) => {
+    buffer += chunk.toString();
+    const lines = buffer.split('\n');
+    buffer = lines.pop() || '';
+    for (const line of lines) {
+      stream.write(prefix + line + '\n');
+    }
+  };
+}
+
+async function startApp(appName, dotenvCli, color) {
+  const args = [
+    dotenvCli,
+    '-e', '.env',
+    '-e', '.env.local',
+    '-e', '.env.development',
+    '-e', '.env.development.local',
+    '--',
+    'pnpm', '--filter', appName, 'run', 'dev',
+  ];
+
+  const child = spawn(process.execPath, args, {
+    stdio: ['inherit', 'pipe', 'pipe'],
+    cwd: ROOT_DIR,
+  });
+
+  const stdoutHandler = createPrefixedStream(appName, color, process.stdout);
+  const stderrHandler = createPrefixedStream(appName, color, process.stderr);
+
+  child.stdout.on('data', stdoutHandler);
+  child.stderr.on('data', stderrHandler);
+
+  child.on('error', (error) => {
+    console.error(`${color}[${appName}]${colors.reset} ${colors.red}启动失败: ${error.message}${colors.reset}`);
+  });
+
+  return child;
+}
+
+async function main() {
+  const args = process.argv.slice(2);
+  const config = await loadConfig();
+
+  // 处理 --list 参数
+  if (args.includes('--list') || args.includes('list')) {
+    listPresets(config);
+    return;
+  }
+
+  // 处理 --config 参数
+  if (args.includes('--config')) {
+    console.log(path.join(ROOT_DIR, CONFIG_FILE));
+    return;
+  }
+
+  // 确定要使用的预设
+  const presetName = args[0] || config.default;
+  if (!presetName) {
+    console.error(`${colors.red}错误: 未指定预设，且配置中未设置默认预设${colors.reset}`);
+    console.error(`${colors.gray}使用 --list 查看可用预设${colors.reset}`);
+    process.exit(1);
+  }
+
+  const preset = config.presets[presetName];
+  if (!preset) {
+    console.error(`${colors.red}错误: 未找到预设 "${presetName}"${colors.reset}`);
+    console.error(`${colors.gray}可用预设: ${Object.keys(config.presets).join(', ')}${colors.reset}`);
+    process.exit(1);
+  }
+
+  const appsToStart = preset.apps;
+  if (!appsToStart || appsToStart.length === 0) {
+    console.error(`${colors.red}错误: 预设 "${presetName}" 中未配置任何应用${colors.reset}`);
+    process.exit(1);
+  }
+
+  // 验证应用是否存在
+  const availableApps = await collectApps();
+  const invalidApps = appsToStart.filter((app) => !availableApps.includes(app));
+  if (invalidApps.length > 0) {
+    console.error(`${colors.red}错误: 以下应用不存在或没有 dev 脚本: ${invalidApps.join(', ')}${colors.reset}`);
+    console.error(`${colors.gray}可用应用: ${availableApps.join(', ')}${colors.reset}`);
+    process.exit(1);
+  }
+
+  // 显示启动 banner
+  printBanner(presetName, appsToStart);
+
+  // 启动所有应用
+  const dotenvCli = await resolveDotenvCli();
+  const children = [];
+
+  for (let i = 0; i < appsToStart.length; i++) {
+    const appName = appsToStart[i];
+    const color = appColors[i % appColors.length];
+    console.log(`${color}[${appName}]${colors.reset} 正在启动...`);
+    const child = await startApp(appName, dotenvCli, color);
+    children.push({ name: appName, process: child });
+  }
+
+  // 处理 Ctrl+C，同时终止所有子进程
+  const cleanup = (signal) => {
+    console.log(`\n${colors.yellow}正在停止所有应用...${colors.reset}`);
+    for (const { name, process: child } of children) {
+      if (!child.killed) {
+        console.log(`${colors.gray}停止 ${name}...${colors.reset}`);
+        child.kill(signal);
+      }
+    }
+  };
+
+  process.on('SIGINT', () => cleanup('SIGINT'));
+  process.on('SIGTERM', () => cleanup('SIGTERM'));
+
+  // 监听子进程退出
+  let exitedCount = 0;
+  for (const { name, process: child } of children) {
+    child.on('exit', (code, signal) => {
+      exitedCount++;
+      if (signal) {
+        console.log(`${colors.gray}[${name}] 被信号 ${signal} 终止${colors.reset}`);
+      } else if (code !== 0) {
+        console.log(`${colors.red}[${name}] 退出，代码: ${code}${colors.reset}`);
+      } else {
+        console.log(`${colors.green}[${name}] 正常退出${colors.reset}`);
+      }
+
+      // 所有进程都退出后，主进程也退出
+      if (exitedCount === children.length) {
+        process.exit(0);
+      }
+    });
+  }
+}
+
+main().catch((error) => {
+  console.error(`${colors.red}执行失败: ${error.message}${colors.reset}`);
+  process.exit(1);
+});

package/generators/h5-react/templates/scripts/dev-preset.schema.json

@@ -0,0 +1,39 @@
+{
+  "$schema": "http://json-schema.org/draft-07/schema#",
+  "title": "Dev Preset Configuration",
+  "description": "多应用并行启动预设配置",
+  "type": "object",
+  "required": ["presets"],
+  "properties": {
+    "$schema": {
+      "type": "string",
+      "description": "JSON Schema 引用"
+    },
+    "presets": {
+      "type": "object",
+      "description": "预设配置列表",
+      "additionalProperties": {
+        "type": "object",
+        "required": ["apps"],
+        "properties": {
+          "description": {
+            "type": "string",
+            "description": "预设描述"
+          },
+          "apps": {
+            "type": "array",
+            "description": "要启动的应用列表",
+            "items": {
+              "type": "string"
+            },
+            "minItems": 0
+          }
+        }
+      }
+    },
+    "default": {
+      "type": "string",
+      "description": "默认使用的预设名称"
+    }
+  }
+}

package/generators/h5-react/templates/scripts/dev.js

@@ -0,0 +1,133 @@
+#!/usr/bin/env node
+const fs = require('node:fs/promises');
+const path = require('node:path');
+const readline = require('node:readline/promises');
+const { stdin: input, stdout: output } = require('node:process');
+const { spawn } = require('node:child_process');
+
+async function collectApps(appsDir) {
+  const entries = await fs.readdir(appsDir, { withFileTypes: true });
+  const apps = [];
+  for (const entry of entries) {
+    if (!entry.isDirectory()) continue;
+    const appName = entry.name;
+    const pkgPath = path.join(appsDir, appName, 'package.json');
+    try {
+      const pkgRaw = await fs.readFile(pkgPath, 'utf8');
+      const pkgJson = JSON.parse(pkgRaw);
+      if (pkgJson?.scripts?.dev) {
+        apps.push({ name: appName });
+      }
+    } catch {
+      // ignore folders without package.json
+    }
+  }
+  return apps;
+}
+
+async function resolveDotenvCli() {
+  const pnpmVirtualStore = path.resolve(
+    __dirname,
+    '..',
+    'node_modules',
+    '.pnpm',
+  );
+  let entries;
+  try {
+    entries = await fs.readdir(pnpmVirtualStore);
+  } catch (_error) {
+    throw new Error('未找到 pnpm 虚拟模块目录，请先执行 pnpm install');
+  }
+  const match = entries.find((entry) => entry.startsWith('dotenv-cli@'));
+  if (!match) {
+    throw new Error('未安装 dotenv-cli，请执行 pnpm install 以继续');
+  }
+  const cliPath = path.join(
+    pnpmVirtualStore,
+    match,
+    'node_modules',
+    'dotenv-cli',
+    'cli.js',
+  );
+  return cliPath;
+}
+
+async function askUser(apps) {
+  output.write('请选择要启动的应用:\n');
+  apps.forEach((app, idx) => {
+    output.write(`  ${idx + 1}. ${app.name}\n`);
+  });
+  const rl = readline.createInterface({ input, output });
+  try {
+    while (true) {
+      const answer = await rl.question('请输入序号后回车: ');
+      const index = Number.parseInt(answer, 10);
+      if (!Number.isNaN(index) && index >= 1 && index <= apps.length) {
+        return apps[index - 1];
+      }
+      output.write('无效的选择, 请重新输入。\n');
+    }
+  } finally {
+    rl.close();
+  }
+}
+
+async function runDev(appName) {
+  const dotenvCli = await resolveDotenvCli();
+  const args = [
+    dotenvCli,
+    '-e',
+    '.env',
+    '-e',
+    '.env.local',
+    '-e',
+    '.env.development',
+    '-e',
+    '.env.development.local',
+    '--',
+    'pnpm',
+    '--filter',
+    appName,
+    'run',
+    'dev',
+  ];
+  const child = spawn(process.execPath, args, {
+    stdio: 'inherit',
+    shell: false,
+  });
+  child.on('exit', (code, signal) => {
+    if (signal) {
+      process.kill(process.pid, signal);
+      return;
+    }
+    process.exit(code ?? 1);
+  });
+  child.on('error', (error) => {
+    console.error(`启动失败: ${error.message}`);
+    process.exit(1);
+  });
+}
+
+async function main() {
+  try {
+    const appsDir = path.resolve(__dirname, '..', 'apps');
+    const apps = await collectApps(appsDir);
+    if (apps.length === 0) {
+      console.error('未找到可启动的应用。');
+      process.exit(1);
+    }
+    let targetApp;
+    if (apps.length === 1) {
+      output.write(`检测到单一应用 ${apps[0].name}, 正在启动...\n`);
+      targetApp = apps[0];
+    } else {
+      targetApp = await askUser(apps);
+    }
+    await runDev(targetApp.name);
+  } catch (error) {
+    console.error(`执行失败: ${error.message}`);
+    process.exit(1);
+  }
+}
+
+main();