@4399ywkf/cli 1.0.7 → 1.0.9

package/dist/templates/pages/base/index.tsx

@@ -1,32 +1,287 @@
-import React from 'react';
-import { createStyles } from "antd-style"
-
-
-const useStyles = createStyles(({ token, isDarkMode }) => ({
-  button: {
-    backgroundColor: token.colorPrimary,
-    width: '100px',
-    color: isDarkMode ? token.colorText : "#fff",
-    padding: `${token.paddingXS}px ${token.paddingSM}px`,
-    borderRadius: token.borderRadius,
-    cursor: 'pointer',
-    transition: 'all 0.3s ease',
-
-    '&:hover': {
-      backgroundColor: token.colorPrimaryHover,
+import { useUserStore } from "@store/user";
+import { Button, Card, Space, Typography, Tag, Flex } from "antd";
+import {
+  RocketOutlined,
+  ThunderboltOutlined,
+  BulbOutlined,
+  GithubOutlined,
+  BookOutlined,
+  SettingOutlined,
+} from "@ant-design/icons";
+import React from "react";
+import { createStyles } from "antd-style";
+
+const { Title, Paragraph, Text } = Typography;
+
+const px = (value: number | string) =>
+  typeof value === "number" ? `${value}px` : value;
+
+const useStyles = createStyles(({ token, css }) => ({
+  root: css`
+    width: 100%;
+    min-height: 100vh;
+    padding: ${px(token.paddingLG)};
+    background: linear-gradient(180deg, ${token.colorFillTertiary}, ${token.colorPrimaryHover});
+    overflow: auto;
+  `,
+  container: css`
+    margin: 0 auto;
+    max-width: 960px;
+  `,
+  hero: css`
+    text-align: center;
+    margin-bottom: ${px(token.marginLG)};
+  `,
+  heroIcon: css`
+    font-size: 3.5rem;
+    color: ${token.colorPrimary};
+    animation: bounce 1.2s infinite alternate;
+
+    @keyframes bounce {
+      from {
+        transform: translateY(0);
+      }
+      to {
+        transform: translateY(-6px);
+      }
+    }
+  `,
+  tagSpace: css`
+    margin-top: ${px(token.marginMD)};
+  `,
+  featuresGrid: css`
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
+    gap: ${px(token.marginSM)};
+    margin-bottom: ${px(token.marginLG)};
+  `,
+  featureCard: css`
+    text-align: center;
+    transition: transform 0.3s ease, box-shadow 0.3s ease;
+
+    &:hover {
+      transform: translateY(-6px);
+      box-shadow: ${token.boxShadowSecondary};
+    }
+  `,
+  quickLinkGrid: css`
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
+    gap: ${px(token.marginSM)};
+  `,
+  quickLink: css`
+    padding: ${px(token.paddingMD)};
+    border-radius: ${px(token.borderRadiusLG)};
+    background: ${token.colorBgContainer};
+    cursor: pointer;
+    transition: background 0.2s ease;
+
+    &:hover {
+      background: ${token.colorBgElevated};
+    }
+  `,
+  footerActions: css`
+    margin-top: ${px(token.marginMD)};
+    text-align: center;
+  `,
+  cardTitle: css`
+    display: inline-flex;
+    align-items: center;
+    gap: ${px(token.marginXS)};
+    font-size: ${px(token.fontSizeHeading4)};
+  `,
+  codeBlock: css`
+    margin-top: ${px(token.marginXS)};
+    padding: ${px(token.paddingSM)};
+    background: ${token.colorFillAlter};
+    border-radius: ${px(token.borderRadiusLG)};
+    font-family: ${token.fontFamilyCode};
+    font-size: ${px(token.fontSizeSM)};
+  `,
+  stepLabel: css`
+    font-size: ${px(token.fontSizeBase)};
+  `,
+  quickLinkLabel: css`
+    font-size: ${px(token.fontSizeHeading2)};
+    margin-bottom: ${px(token.marginXS)};
+  `,
+  quickLinkDescription: css`
+    color: ${token.colorTextTertiary};
+  `,
+  panelCard: css`
+    margin-bottom: ${px(token.marginLG)};
+    background: ${token.colorBgElevated};
+  `,
+  featureIcon: css`
+    margin-bottom: ${px(token.marginMD)};
+  `,
+  footerParagraph: css`
+    margin-top: ${px(token.marginMD)};
+    color: ${token.colorTextTertiary};
+  `,
+  textCenterCard: css`
+    text-align: center;
+  `,
+}));
+
+export default function BasePage() {
+  const theme = useUserStore((state) => state.themeMode);
+  const setTheme = useUserStore((state) => state.setThemeMode);
+  const { styles, cx } = useStyles();
+
+  const features = [
+    {
+      icon: <ThunderboltOutlined className={styles.heroIcon} />,
+      title: "Rspack 构建",
+      description: "基于 Rspack 的极速构建体验，开发效率翻倍",
     },
-    '&:active': {
-      backgroundColor: token.colorPrimaryActive,
+    {
+      icon: <BulbOutlined className={styles.heroIcon} />,
+      title: "React 19",
+      description: "使用最新的 React 19 特性，享受并发渲染",
     },
-  },
-}));
+    {
+      icon: <SettingOutlined className={styles.heroIcon} />,
+      title: "TypeScript",
+      description: "完整的 TypeScript 支持，类型安全有保障",
+    },
+  ];
+
+  const quickLinks = [
+    { label: "📖 文档", description: "查看完整文档" },
+    { label: "🎨 组件库", description: "Ant Design 组件" },
+    { label: "🔧 配置", description: "项目配置说明" },
+    { label: "🚀 部署", description: "部署指南" },
+  ];
 
-export default function Base() {
-  const { styles } = useStyles();
   return (
-    <div className={styles.button}>
-      Base
-      {/* <Button type="primary">antd按钮</Button> */}
+    <div className={cx(styles.root)}>
+      <div className={styles.container}>
+        <Flex vertical gap={12}>
+          <section className={styles.hero}>
+            <div>
+              <RocketOutlined className={styles.heroIcon} />
+            </div>
+            <Title level={1} style={{ marginBottom: 16 }}>
+              🎉 恭喜！项目创建成功
+            </Title>
+            <Paragraph>
+              你的项目已经准备就绪，现在可以开始开发了
+            </Paragraph>
+            <Space size="middle" className={styles.tagSpace}>
+              <Tag color="blue">React 19</Tag>
+              <Tag color="green">TypeScript</Tag>
+              <Tag color="orange">Rspack</Tag>
+              <Tag color="purple">Ant Design</Tag>
+              <Tag color="cyan">Tailwind CSS</Tag>
+            </Space>
+          </section>
+
+          <div className={styles.featuresGrid}>
+            {features.map((feature, index) => (
+              <Card
+                key={index}
+                hoverable
+                className={cx(styles.featureCard)}
+                bodyStyle={{ padding: 24 }}
+              >
+                <div className={styles.featureIcon}>{feature.icon}</div>
+                <Title level={4}>{feature.title}</Title>
+                <Paragraph type="secondary">{feature.description}</Paragraph>
+              </Card>
+            ))}
+          </div>
+
+          <Card
+            title={
+              <span className={styles.cardTitle}>
+                <BookOutlined />
+                快速开始
+              </span>
+            }
+            className={styles.panelCard}
+          >
+            <Space direction="vertical" size="large">
+              <div>
+                <Text strong className={styles.stepLabel}>
+                  1. 安装依赖
+                </Text>
+                <div className={styles.codeBlock}>
+                  <code>pnpm install</code>
+                </div>
+              </div>
+              <div>
+                <Text strong className={styles.stepLabel}>
+                  2. 启动开发服务器
+                </Text>
+                <div className={styles.codeBlock}>
+                  <code>pnpm dev</code>
+                </div>
+              </div>
+              <div>
+                <Text strong className={styles.stepLabel}>
+                  3. 构建生产版本
+                </Text>
+                <div className={styles.codeBlock}>
+                  <code>pnpm build</code>
+                </div>
+              </div>
+            </Space>
+          </Card>
+
+          <Card
+            title={
+              <span className={styles.cardTitle}>
+                <GithubOutlined />
+                快捷链接
+              </span>
+            }
+            className={styles.panelCard}
+          >
+            <div className={styles.quickLinkGrid}>
+              {quickLinks.map((link, index) => (
+                <div key={index} className={styles.quickLink}>
+                  <div className={styles.quickLinkLabel}>{link.label}</div>
+                  <Text className={styles.quickLinkDescription}>
+                    {link.description}
+                  </Text>
+                </div>
+              ))}
+            </div>
+          </Card>
+
+          <Card className={cx(styles.panelCard, styles.textCenterCard)}>
+            <div className={styles.footerActions}>
+              <Space size="large" wrap>
+                <Button
+                  type="primary"
+                  size="large"
+                  icon={<RocketOutlined />}
+                  onClick={() => window.open("https://ant.design", "_blank")}
+                >
+                  查看 Ant Design 文档
+                </Button>
+                <Button
+                  size="large"
+                  icon={<BookOutlined />}
+                  onClick={() => window.open("https://react.dev", "_blank")}
+                >
+                  React 文档
+                </Button>
+                <Button
+                  size="large"
+                  onClick={() => setTheme(theme === "dark" ? "light" : "dark")}
+                >
+                  切换主题 ({theme === "dark" ? "🌙 暗色" : "☀️ 亮色"})
+                </Button>
+              </Space>
+              <Paragraph className={styles.footerParagraph}>
+                祝你开发愉快！如有问题，请查阅文档或联系技术支持 💪
+              </Paragraph>
+            </div>
+          </Card>
+        </Flex>
+      </div>
     </div>
   );
 }

package/dist/templates/protectedPatterns.ts

@@ -0,0 +1,91 @@
+/**
+ * Protected patterns for i18n keys
+ *
+ * Keys matching these patterns will be considered "used" even if not found in static analysis.
+ * This is useful for dynamically generated keys like:
+ * - t(`modelProvider.${providerId}.title`)
+ * - t('error.' + errorCode)
+ */
+
+/**
+ * Files to ignore at file level (won't be scanned at all)
+ */
+export const IGNORED_FILES = [
+  'providers.ts', // Dynamically generated from DEFAULT_MODEL_PROVIDER_LIST
+  'models.ts', // Dynamically generated from LOBE_DEFAULT_MODEL_LIST
+  'auth.ts', // Auth-related dynamic keys
+  'authError.ts', // Auth error dynamic keys
+  'error.ts', // Error messages with dynamic codes
+  'migration.ts', // Migration-related dynamic keys
+  'subscription.ts',
+  'electron.ts', // Electron-specific dynamic keys
+  'editor.ts', // Editor-related dynamic keys
+  'changelog.ts', // Changelog dynamic keys
+  'ragEval.ts',
+  'plugin.ts',
+  'tools.ts',
+  'oauth.ts',
+];
+
+/**
+ * Namespace patterns to protect (keys won't be marked as unused)
+ */
+export const PROTECTED_KEY_PATTERNS = [
+  // === Namespaces with extensive dynamic usage ===
+  'modelProvider', // t(`modelProvider.${providerId}.title`)
+
+  // Discover namespace has many dynamic keys
+  'discover', // t(`assistants.status.${statusKey}.subtitle`)
+
+  // Setting namespace with dynamic agent configurations
+  'setting', // t(`systemAgent.${key}.label`)
+
+  // Hotkey namespace uses dynamic key construction
+  'hotkey', // t(`${item.id}.desc`, { ns: 'hotkey' })
+
+  // Home namespace with dynamic starter keys
+  'home', // t(`starter.${key}`)
+
+  // Welcome namespace with returnObjects usage
+  'welcome', // t('welcomeMessages', { returnObjects: true })
+
+  // Chat namespace has dynamic input keys
+  'chat', // t(`input.${key}`)
+
+  // File namespace - used in hooks that receive t as parameter
+  'file', // TFunction<'file'> passed as parameter
+
+  // MarketAuth namespace - has Trans components with dynamic keys
+  'marketAuth', // <Trans i18nKey="authorize.footer.agreement" />
+
+  // Onboarding namespace - has various dynamic usage patterns
+  'onboarding', // Onboarding flow with complex Trans usage
+  'error',
+  'errors',
+  'consent.error',
+  'builtins',
+
+  // === Add your custom patterns here ===
+  // Examples:
+  // 'error.code',           // Protects all error.code.* keys
+  // 'plugin.settings',      // Protects all plugin.settings.* keys
+  // 'tool',                 // Protects entire 'tool' namespace
+];
+
+/**
+ * How to use:
+ *
+ * 1. IGNORED_FILES - Files to completely skip during analysis:
+ *    Add filename with .ts extension (e.g., 'auth.ts')
+ *    These files won't be scanned at all
+ *
+ * 2. PROTECTED_KEY_PATTERNS - Namespace/patterns to protect:
+ *    - Full namespace: 'myNamespace' protects all keys under that namespace
+ *    - Prefix pattern: 'namespace.prefix' protects keys starting with that prefix
+ *      (e.g., 'error.code' protects 'error.code.NOT_FOUND', 'error.code.TIMEOUT', etc.)
+ *
+ * 3. After modifying this file:
+ *    - Run `bun run workflow:i18n-analyze` to regenerate the report
+ *    - Run `bun run workflow:i18n-clean` to preview cleanup (both use same config)
+ *    - Check the console output for "Protected patterns" to verify your config
+ */

package/dist/templates/react-app-env.d.ts

@@ -1,13 +1,18 @@
 // typings.d.ts
-declare module '*.css';
-declare module '*.less';
-declare module '*.png';
-declare module '*.jpeg';
-declare module '*.jpg';
-declare module '*.scss';
-declare module '*.svg' {
+declare module "*.css";
+declare module "*.less";
+declare module "*.png";
+declare module "*.jpeg";
+declare module "*.jpg";
+declare module "*.scss";
+declare module "*.woff";
+declare module "*.woff2";
+declare module "*.ttf";
+declare module "*.eot";
+declare module "*.otf";
+declare module "*.svg" {
   export function ReactComponent(
-    props: React.SVGProps<SVGSVGElement>,
+    props: React.SVGProps<SVGSVGElement>
   ): React.ReactElement;
   const url: string;
   export default url;

package/dist/templates/request/error-handler.ts

@@ -0,0 +1,67 @@
+import { message as antdMessage } from "antd";
+import type { AxiosError } from "axios";
+import type { RequestConfig, ApiResponse } from "./types";
+
+/**
+ * 错误处理器
+ */
+export class ErrorHandler {
+  /**
+   * 处理请求错误
+   */
+  handle(error: any, config?: RequestConfig): void {
+    const messageConfig = config?.message;
+
+    // 如果明确禁用错误提示
+    if (messageConfig?.showError === false) {
+      return;
+    }
+
+    const axiosError = error as AxiosError<ApiResponse>;
+    let errorMessage = messageConfig?.errorMessage;
+
+    // 如果没有自定义错误消息，使用默认逻辑
+    if (!errorMessage) {
+      if (axiosError.response) {
+        const { status, data } = axiosError.response;
+
+        // 优先使用后端返回的消息
+        errorMessage = data?.message;
+
+        // 如果后端没有返回消息，使用默认消息
+        if (!errorMessage) {
+          errorMessage = this.getDefaultErrorMessage(status);
+        }
+      } else if (axiosError.request) {
+        errorMessage = "网络错误，请检查您的网络连接";
+      } else {
+        errorMessage = axiosError.message || "请求失败";
+      }
+    }
+
+    // 显示错误提示
+    antdMessage.error(errorMessage);
+  }
+
+  /**
+   * 获取默认错误消息
+   */
+  private getDefaultErrorMessage(status: number): string {
+    const errorMessages: Record<number, string> = {
+      400: "请求参数错误",
+      401: "未授权，请重新登录",
+      403: "拒绝访问",
+      404: "请求的资源不存在",
+      405: "请求方法不允许",
+      408: "请求超时",
+      500: "服务器内部错误",
+      502: "网关错误",
+      503: "服务暂时不可用",
+      504: "网关超时",
+    };
+
+    return errorMessages[status] || `请求失败 (${status})`;
+  }
+}
+
+export const errorHandler = new ErrorHandler();