@mindbase/cli 1.0.4 → 1.0.8

package/src/utils/FrontendInitializer.ts

@@ -0,0 +1,370 @@
+import fs from "fs";
+import path from "path";
+import prompts from "prompts";
+import logger from "./Logger";
+import {
+  FRONTEND_APP_TYPES,
+  getFrontendPackage,
+  getAvailableFrontendApps,
+  resolveFrontendDependencies,
+} from "./prompts";
+
+export interface FrontendConfig {
+  name: string;
+  description: string;
+  author: string;
+  port: number;
+  proxyTarget: string;
+  proxyPath: string;
+  appType: string;
+}
+
+/**
+ * 收集前端项目初始化配置
+ */
+export async function collectFrontendConfig(cwd: string): Promise<FrontendConfig> {
+  const folderName = path.basename(cwd);
+  const availableApps = getAvailableFrontendApps();
+
+  const response = await prompts([
+    {
+      type: "text",
+      name: "name",
+      message: "项目名称",
+      initial: folderName,
+      validate: (value: string) => value.length > 0 || "项目名称不能为空",
+    },
+    {
+      type: "text",
+      name: "description",
+      message: "项目描述",
+      initial: "MindBase 前端应用",
+    },
+    {
+      type: "text",
+      name: "author",
+      message: "作者",
+      initial: "",
+    },
+    {
+      type: "text",
+      name: "port",
+      message: "开发服务器端口",
+      initial: "5173",
+      validate: (value: string) => {
+        const val = typeof value === "number" ? value : parseInt(value, 10);
+        if (isNaN(val) || val < 1 || val > 65535) {
+          return "端口号必须为在 1-65535 之间的数字";
+        }
+        return true;
+      },
+    },
+    {
+      type: "text",
+      name: "proxyTarget",
+      message: "API 代理目标地址",
+      initial: "http://localhost:3000",
+    },
+    {
+      type: "text",
+      name: "proxyPath",
+
+      message: "API 代理路径 (留空则不代理)",
+      initial: "/api",
+    },
+    {
+      type: "select",
+      name: "appType",
+      message: "选择应用形态",
+      choices: availableApps.map((app) => ({
+        title: app.description,
+        value: app.name,
+      })),
+      initial: 0,
+    },
+  ]);
+
+  if (Object.keys(response).length < 7) {
+    throw new Error("用户取消了初始化流程");
+  }
+
+  logger.info(`已选择应用形态: ${response.appType}`);
+
+  return response as FrontendConfig;
+}
+
+/**
+ * 初始化 package.json
+ */
+export function setupFrontendPackageJson(cwd: string, config: FrontendConfig) {
+  const pkgPath = path.join(cwd, "package.json");
+  let pkg: any = {};
+
+  if (fs.existsSync(pkgPath)) {
+    pkg = JSON.parse(fs.readFileSync(pkgPath, "utf-8"));
+    logger.info("✓ 检测到已存在的 package.json，正在更新配置...");
+  } else {
+    pkg = {
+      name: config.name,
+      version: "1.0.0",
+      description: config.description,
+      author: config.author,
+      private: true,
+      type: "module",
+      dependencies: {
+        axios: "^1.7.0",
+        "crypto-js": "^4.2.0",
+        dayjs: "^1.11.19",
+        "element-plus": "^2.9.0",
+        "element-plus/icons-vue": "^2.9.0",
+        "lodash-es": "^4.17.21",
+        pinia: "^2.2.0",
+        "spark-md5": "^3.0.2",
+        vue: "^3.5.0",
+        "vue-router": "^4.5.0",
+      },
+      devDependencies: {
+        "@vitejs/plugin-vue": "^5.2.0",
+        typescript: "^5.6.0",
+        vite: "^6.0.0",
+        "vue-tsc": "^2.2.0",
+      },
+    };
+    logger.info("✓ 正在生成 package.json...");
+  }
+
+  // 注入标准脚本
+  pkg.scripts = pkg.scripts || {};
+  pkg.scripts["start"] = "npm run dev";
+  pkg.scripts["dev"] = `vite --port ${config.port}`;
+  pkg.scripts["build"] = "vue-tsc -b && vite build";
+  pkg.scripts["preview"] = "vite preview";
+
+  // 添加依赖（包含所有依赖包）
+  const allPackages = resolveFrontendDependencies(config.appType);
+  for (const packageName of allPackages) {
+    pkg.dependencies = pkg.dependencies || {};
+    pkg.dependencies[packageName] = "^1.0.0";
+  }
+
+  pkg.devDependencies = pkg.devDependencies || {};
+  pkg.devDependencies["vue-tsc"] = "^2.2.0";
+
+  fs.writeFileSync(pkgPath, JSON.stringify(pkg, null, 2));
+  logger.info("✓ package.json 已就绪");
+}
+
+/**
+ * 初始化 Vite 配置 vite.config.ts
+ */
+export function setupViteConfig(cwd: string, config: FrontendConfig) {
+  const viteConfigPath = path.join(cwd, "vite.config.ts");
+
+  const proxyConfig = config.proxyPath
+    ? `{
+      '${config.proxyPath}': {
+        target: '${config.proxyTarget}',
+        changeOrigin: true,
+      },
+    }`
+    : "undefined";
+
+  const viteConfigContent = `import { defineConfig } from "vite";
+import vue from "@vitejs/plugin-vue";
+import path from "path";
+
+export default defineConfig({
+  plugins: [vue()],
+  resolve: {
+    alias: {
+      "@": path.resolve(__dirname, "./src"),
+    },
+  },
+  server: {
+    port: ${config.port},
+    proxy: ${proxyConfig},
+  },
+});
+`;
+  fs.writeFileSync(viteConfigPath, viteConfigContent);
+  logger.info("✓ vite.config.ts 已就绪");
+}
+
+/**
+ * 初始化 TypeScript 配置
+ */
+export function setupFrontendTsConfig(cwd: string) {
+  // tsconfig.json
+  const tsconfigPath = path.join(cwd, "tsconfig.json");
+  if (!fs.existsSync(tsconfigPath)) {
+    const tsconfigContent = {
+      compilerOptions: {
+        target: "ES2022",
+        module: "ESNext",
+        moduleResolution: "bundler",
+        strict: true,
+        esModuleInterop: true,
+        skipLibCheck: true,
+        forceConsistentCasingInFileNames: true,
+        resolveJsonModule: true,
+        isolatedModules: true,
+        noEmit: true,
+        lib: ["ES2022", "DOM", "DOM.Iterable"],
+        types: ["vite/client"],
+      },
+      include: ["src/**/*.ts", "src/**/*.vue", "vite.config.ts"],
+    };
+    fs.writeFileSync(tsconfigPath, JSON.stringify(tsconfigContent, null, 2));
+    logger.info("✓ tsconfig.json 已就绪");
+  }
+}
+
+/**
+ * 初始化 index.html
+ */
+export function setupIndexHtml(cwd: string, config: FrontendConfig) {
+  const htmlPath = path.join(cwd, "index.html");
+
+  const htmlContent = `<!DOCTYPE html>
+<html lang="zh-CN">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>${config.name}</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/main.ts"></script>
+  </body>
+</html>
+`;
+  fs.writeFileSync(htmlPath, htmlContent);
+  logger.info("✓ index.html 已就绪");
+}
+
+/**
+ * 初始化源文件
+ */
+export function setupAppFiles(cwd: string, config: FrontendConfig) {
+  const srcDir = path.join(cwd, "src");
+  if (!fs.existsSync(srcDir)) fs.mkdirSync(srcDir, { recursive: true });
+
+  // main.ts
+  const mainContent = `import {
+  createMindBaseApp,
+  createGlobComponentMap,
+} from "${getFrontendPackage(config.appType)}";
+
+const { app, pinia } = createMindBaseApp({
+  router: {},
+  componentMap: createGlobComponentMap(import.meta.glob("./views/**/*.vue"), "./views/"),
+});
+
+app.mount("#app");
+`;
+  fs.writeFileSync(path.join(srcDir, "main.ts"), mainContent);
+  logger.info("✓ src/main.ts 已就绪");
+
+  // App.vue
+  const appContent = `<template>
+  <router-view />
+</template>
+
+<script setup lang="ts">
+// 根组件
+</script>
+
+<style>
+html,
+body,
+#app {
+  margin: 0;
+  padding: 0;
+  width: 100%;
+  height: 100%;
+}
+</style>
+`;
+  fs.writeFileSync(path.join(srcDir, "App.vue"), appContent);
+  logger.info("✓ src/App.vue 已就绪");
+
+  // views 目录
+  const viewsDir = path.join(srcDir, "views");
+  if (!fs.existsSync(viewsDir)) fs.mkdirSync(viewsDir);
+
+  // 示例页面
+  const exampleView = `<template>
+  <div class="home">
+    <h1>欢迎使用 ${config.name}</h1>
+  </div>
+</template>
+
+<script setup lang="ts">
+// 页面逻辑
+</script>
+
+<style scoped>
+.home {
+  padding: 20px;
+}
+</style>
+`;
+  fs.writeFileSync(path.join(viewsDir, "index.vue"), exampleView);
+  logger.info("✓ src/views/index.vue 已就绪");
+}
+
+/**
+ * 创建 public 目录
+ */
+export function setupPublicDir(cwd: string) {
+  const publicDir = path.join(cwd, "public");
+  if (!fs.existsSync(publicDir)) {
+    fs.mkdirSync(publicDir, { recursive: true });
+    logger.info("✓ public 目录已创建");
+  }
+}
+
+/**
+ * 复制 admin 专用资源（如字体文件）
+ * @param cwd 项目根目录
+ * @param config 前端配置
+ */
+export function copyAdminAssets(cwd: string, config: FrontendConfig) {
+  // 只处理 admin-app 类型
+  if (config.appType !== "admin-app") {
+    return;
+  }
+
+  const sourceDir = path.join(__dirname, "../assets/iconfont");
+
+  // 检查源目录是否存在
+  if (!fs.existsSync(sourceDir)) {
+    logger.warn("字体源目录不存在，跳过复制");
+    return;
+  }
+
+  // 目标目录：public/assets/mb-iconfont/
+  const targetDir = path.join(cwd, "public/assets/mb-iconfont");
+  if (!fs.existsSync(targetDir)) {
+    fs.mkdirSync(targetDir, { recursive: true });
+  }
+
+  // 复制字体文件
+  const fonts = ["iconfont.woff2", "iconfont.woff", "iconfont.ttf"];
+  let copiedCount = 0;
+
+  fonts.forEach((font) => {
+    const sourcePath = path.join(sourceDir, font);
+    const targetPath = path.join(targetDir, font);
+
+    if (fs.existsSync(sourcePath)) {
+      fs.copyFileSync(sourcePath, targetPath);
+      copiedCount++;
+    }
+  });
+
+  if (copiedCount > 0) {
+    logger.info(`✓ 已复制 ${copiedCount} 个字体文件到 public/assets/mb-iconfont/`);
+  }
+}

package/src/utils/Logger.ts

@@ -0,0 +1,219 @@
+export type LogLevel = "debug" | "info" | "warn" | "error" | "silent";
+
+const LOG_LEVELS = {
+  debug: 0,
+  info: 1,
+  warn: 2,
+  error: 3,
+  silent: 4,
+} as const;
+
+let currentLogLevel: LogLevel = "info";
+
+const COLORS: Record<LogLevel | "reset", string> = {
+  debug: "\x1b[36m",
+  info: "\x1b[32m",
+  warn: "\x1b[33m",
+  error: "\x1b[31m",
+  silent: "\x1b[0m",
+  reset: "\x1b[0m",
+};
+
+/**
+ * 格式化时间戳
+ */
+function formatTimestamp(): string {
+  const now = new Date();
+  const year = now.getFullYear();
+  const month = String(now.getMonth() + 1).padStart(2, "0");
+  const day = String(now.getDate()).padStart(2, "0");
+  const hours = String(now.getHours()).padStart(2, "0");
+  const minutes = String(now.getMinutes()).padStart(2, "0");
+  const seconds = String(now.getSeconds()).padStart(2, "0");
+  return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
+}
+
+/**
+ * 计算字符串在终端中的视觉宽度
+ * 修复：区分单宽符号 (如 ✓) 和双宽符号 (如 中文、Emoji)
+ */
+function getVisualWidth(str: string): number {
+  let width = 0;
+  const segmenter = new Intl.Segmenter(undefined, { granularity: "grapheme" });
+  for (const { segment } of segmenter.segment(str)) {
+    const charCode = segment.charCodeAt(0);
+
+    // 1. 基础 ASCII
+    if (charCode <= 255) {
+      width += 1;
+      continue;
+    }
+
+    // 2. CJK 字符集范围 (常用中文、标点、全角符号)
+    const isCJK =
+      (charCode >= 0x4e00 && charCode <= 0x9fff) || // CJK Unified Ideographs
+      (charCode >= 0x3000 && charCode <= 0x303f) || // CJK Symbols and Punctuation
+      (charCode >= 0xff00 && charCode <= 0xffef); // Fullwidth Forms
+
+    // 3. Emoji 或代理对 (通常 segment.length > 1)
+    const isMultiByte = segment.length > 1;
+
+    if (isCJK || isMultiByte) {
+      width += 2;
+    } else {
+      // 4. 其他特殊符号 (如 ✓, ★, ☎) 在大多数终端占 1 格
+      width += 1;
+    }
+  }
+  return width;
+}
+
+/**
+ * 截断字符串以适应视觉宽度，从头部截断并保留末尾
+ */
+function truncateToWidth(str: string, maxWidth: number): string {
+  const segmenter = new Intl.Segmenter(undefined, { granularity: "grapheme" });
+  const segments = Array.from(segmenter.segment(str)).map((s) => s.segment);
+
+  if (getVisualWidth(str) <= maxWidth) return str;
+
+  let currentWidth = 3; // 为 "..." 预留
+  let result = "";
+
+  // 从后往前遍历 segments
+  for (let i = segments.length - 1; i >= 0; i--) {
+    const segment = segments[i];
+    const segmentWidth = getVisualWidth(segment);
+    if (currentWidth + segmentWidth > maxWidth) break;
+    result = segment + result;
+    currentWidth += segmentWidth;
+  }
+  return "..." + result;
+}
+
+function formatMessage(level: LogLevel, message: string): string {
+  const timestamp = formatTimestamp();
+  const terminalWidth = process.stdout.columns || 80;
+  const timeStr = ` ${timestamp}`;
+  const timeWidth = getVisualWidth(timeStr);
+  const maxMessageWidth = terminalWidth - timeWidth - 2;
+
+  let displayMessage = message;
+  const messageWidth = getVisualWidth(displayMessage);
+
+  if (messageWidth > maxMessageWidth) {
+    displayMessage = truncateToWidth(displayMessage, maxMessageWidth);
+  }
+
+  const currentMsgWidth = getVisualWidth(displayMessage);
+  const paddingCount = Math.max(0, terminalWidth - currentMsgWidth - timeWidth);
+  const padding = " ".repeat(paddingCount);
+
+  return `${COLORS[level]}${displayMessage}${padding}${timeStr}${COLORS.reset}`;
+}
+
+const startupTime = Date.now();
+
+// 标签填充函数（目标显示宽度 8，空格分散到字符间）
+function padTag(tag: string, targetWidth = 8): string {
+  const currentWidth = getVisualWidth(tag);
+  const padding = Math.max(0, targetWidth - currentWidth);
+
+  if (padding === 0) return tag;
+
+  // 将空格均匀分散到字符之间
+  const chars = [...tag]; // 按码点分割
+  const gapCount = chars.length + 1; // 间隙数 = 字符数 + 1（前后和中间）
+
+  // 计算每个间隙的空格数
+  const baseSpaces = Math.floor(padding / gapCount);
+  const extraSpaces = padding % gapCount;
+
+  let result = "";
+  for (let i = 0; i < chars.length; i++) {
+    // 每个间隙的空格 = 基础空格 + 额外空格（前 extraSpaces 个间隙多1个）
+    const spaces = baseSpaces + (i < extraSpaces ? 1 : 0);
+    result += " ".repeat(spaces) + chars[i];
+  }
+  // 最后一个间隙
+  result += " ".repeat(baseSpaces + (chars.length < extraSpaces ? 1 : 0));
+
+  return result;
+}
+
+function startupMessage(message: string, tag?: string): string {
+  const diff = Date.now() - startupTime;
+  const timeStr = diff.toString().padStart(6, "0");
+  const tagStr = tag ? `【${padTag(tag)}】` : "";
+  return `${COLORS["warn"]}[${timeStr}] ${tagStr}${message}${COLORS["reset"]}`;
+}
+
+function shouldLog(level: LogLevel): boolean {
+  return LOG_LEVELS[level] >= LOG_LEVELS[currentLogLevel];
+}
+
+function formatArgs(args: any[]): string {
+  return args
+    .map((arg) => {
+      if (arg instanceof Error) {
+        return arg.message;
+      }
+      if (typeof arg === "object") {
+        return JSON.stringify(arg, null, 2);
+      }
+      return String(arg);
+    })
+    .join(" ");
+}
+
+export const logger = {
+  debug(...args: any[]): void {
+    if (shouldLog("debug")) {
+      console.log(formatMessage("debug", formatArgs(args)));
+    }
+  },
+
+  info(...args: any[]): void {
+    if (shouldLog("info")) {
+      console.log(formatMessage("info", formatArgs(args)));
+    }
+  },
+
+  warn(...args: any[]): void {
+    if (shouldLog("warn")) {
+      console.warn(formatMessage("warn", formatArgs(args)));
+    }
+  },
+
+  error(...args: any[]): void {
+    if (shouldLog("error")) {
+      // 先打印带颜色的格式化消息
+      console.error(formatMessage("error", formatArgs(args)));
+      // 如果有 Error 对象，用 console.error 单独打印以显示堆栈
+      const errorArg = args.find((arg) => arg instanceof Error);
+      if (errorArg) {
+        console.error(errorArg);
+      }
+    }
+  },
+
+  startup(tagOrMessage: string, ...args: any[]): void {
+    // 如果有额外参数，第一个是标签，其余是消息
+    // 否则第一个参数是消息，无标签
+    if (args.length > 0) {
+      console.log(startupMessage(formatArgs(args), tagOrMessage));
+    } else {
+      console.log(startupMessage(tagOrMessage));
+    }
+  },
+
+  setLevel(level: LogLevel): void {
+    currentLogLevel = level;
+  },
+
+  getLevel(): LogLevel {
+    return currentLogLevel;
+  },
+};
+
+export default logger;