generator-mico-cli 0.2.19 → 0.2.21

package/generators/micro-react/templates/packages/common-intl/src/utils.ts

@@ -1,5 +1,16 @@
 import { isIndexedDBSupported, openDatabase } from './indexedDBUtils';
 
+// ============ Window 类型扩展 ============
+
+/**
+ * 扩展 Window 接口，声明微前端共享的全局翻译缓存
+ */
+declare global {
+	interface Window {
+		__MICO_COMMON_INTL_TRANSLATIONS__?: Record<string, Record<string, string>>;
+	}
+}
+
 // ============ 常量定义 ============
 
 export const LANG = {
@@ -75,14 +86,6 @@ const API_CONFIG = {
 
 // ============ 全局状态 ============
 
-/**
- * 微前端共享全局状态 Key
- * 在 qiankun 微前端架构中，主应用和子应用各自有独立的 JS 运行时，
- * 模块级变量无法共享。使用 window 对象存储全局状态，确保主应用获取到的文案
- * 可以被所有子应用访问。
- */
-const GLOBAL_TRANSLATIONS_KEY = '__MICO_COMMON_INTL_TRANSLATIONS__';
-
 /**
  * 语言管理工具
  * 支持三种配置渠道，优先级从高到低：
@@ -136,7 +139,7 @@ function getBrowserLocale(): ILang {
   if (typeof window === 'undefined') {
     return DEFAULT_LOCALE;
   }
-  const browserLang = navigator.language || (navigator as any).userLanguage;
+  const browserLang = navigator.language;
   // 检查语言前缀（如 zh-TW -> zh-CN）
   const langPrefix = browserLang.split('-')[0];
   const matchedLocale = SUPPORTED_LOCALES.find((locale) =>
@@ -194,12 +197,12 @@ export function setLocaleToStorage(locale: ILang): void {
  * 获取共享的翻译缓存对象
  */
 function getSharedTranslationsCache(): Record<string, Record<string, string>> {
-  if (typeof window !== 'undefined') {
-    if (!(window as any)[GLOBAL_TRANSLATIONS_KEY]) {
-      (window as any)[GLOBAL_TRANSLATIONS_KEY] = {};
-    }
-    return (window as any)[GLOBAL_TRANSLATIONS_KEY];
-  }
+	if (typeof window !== "undefined") {
+		if (!window.__MICO_COMMON_INTL_TRANSLATIONS__) {
+			window.__MICO_COMMON_INTL_TRANSLATIONS__ = {};
+		}
+		return window.__MICO_COMMON_INTL_TRANSLATIONS__;
+	}
   // 非浏览器环境使用本地缓存
   return {};
 }
@@ -313,8 +316,6 @@ function getTranslationsFromCacheSync(
 // ============ i18n 函数 ============
 
 /**
- * @see https://micoworld.feishu.cn/wiki/wikcnBMzhhc8qpAVawAoySZanrg#DS1YNZ
- *
  * 国际化翻译函数
  *
  * 从全局变量缓存中获取翻译后的文案，支持插值替换
@@ -327,17 +328,17 @@ function getTranslationsFromCacheSync(
  *
  * @example
  * // 无插值示例
- * i18n({ key: 'cs_web_create_ticket_cancel', defaultMessage: '取消' })
+ * i18n({ key: 'common_cancel', defaultMessage: '取消' })
  * // 返回 'Cancel' 或兜底文案 '取消'
  *
  * @example
  * // 单个插值示例
- * i18n({ key: 'cs_web_page_total_count', interpolations: [pagination.total], defaultMessage: `总数量: ${pagination.total}条` })
+ * i18n({ key: 'common_page_total_count', interpolations: [pagination.total], defaultMessage: `总数量: ${pagination.total}条` })
  * // 如果翻译文案为 '总数量: %AA%条'，则返回 '总数量: 100条'
  *
  * @example
  * // 多个插值示例
- * i18n({ key: 'xxxxx', interpolations: [valueA, valueB, valueC], defaultMessage: `XXX${valueA}YYY${valueB}ZZZ${valueC}` })
+ * i18n({ key: 'some_key', interpolations: [valueA, valueB, valueC], defaultMessage: `XXX${valueA}YYY${valueB}ZZZ${valueC}` })
  * // 如果翻译文案为 'XXX%AA%YYY%BB%ZZZ%CC%'，则按顺序替换占位符
  */
 export function i18n({
@@ -433,7 +434,7 @@ export function initIntl(params: IInitIntlParams) {
       throw new Error('参数 app_name 不能为空');
     }
 
-    // @ts-ignore
+    // @ts-expect-error - process.env 类型在不同构建环境中可能不兼容
     return requestInstance(process.env.LOCALE_REQUEST_URL || API_CONFIG[process.env.REACT_APP_ENV as keyof typeof API_CONFIG] || API_CONFIG.production, {
       method: 'GET',
       params: {

package/generators/subapp-react/index.js

@@ -9,10 +9,10 @@ const {
   collectFiles,
   transformDestPath,
   isTemplateFile,
-  getLatestNpmVersion,
+  getPackageVersionsParallel,
   setupErrorHandlers,
   createLogger,
-  // isVerbose,
+  loadMicorc,
 } = require('../../lib/utils');
 
 const IGNORE_LIST = require('./ignore-list.json');
@@ -24,6 +24,18 @@ module.exports = class extends Generator {
   initializing() {
     this.monorepoRoot = process.cwd();
     this.logger = createLogger(this);
+
+    // 检查 dry-run 模式
+    this.isDryRun = this.options.dryRun || process.env.MICO_DRY_RUN === '1';
+
+    // 加载 .micorc 配置
+    const { config: rcConfig, configPath } = loadMicorc(this.monorepoRoot);
+    this.rcConfig = rcConfig;
+    if (configPath) {
+      this.logger.verbose('Loaded config from:', configPath);
+      this.logger.verbose('Config:', JSON.stringify(rcConfig, null, 2));
+    }
+
     const appsDir = path.join(this.monorepoRoot, 'apps');
     const workspaceFile = path.join(this.monorepoRoot, 'pnpm-workspace.yaml');
 
@@ -77,13 +89,14 @@ module.exports = class extends Generator {
       }
 
       const detectedScope = this._detectPackageScope();
+      const rc = this.rcConfig || {};
 
       this.answers = await this.prompt([
         {
           type: 'input',
           name: 'appName',
           message: 'Sub app name',
-          default: 'subapp',
+          default: rc.defaultSubappName || 'subapp',
           filter: (input) => toKebab(input),
           validate: (input) => {
             const value = toKebab(input);
@@ -99,7 +112,7 @@ module.exports = class extends Generator {
           type: 'input',
           name: 'packageScope',
           message: 'Package scope',
-          default: detectedScope || '@my-project',
+          default: rc.packageScope || detectedScope || '@my-project',
           validate: (input) => {
             if (!input) return 'Package scope is required';
             if (!input.startsWith('@')) return 'Package scope must start with @';
@@ -122,7 +135,7 @@ module.exports = class extends Generator {
     }
   }
 
-  writing() {
+  async writing() {
     try {
       if (!fs.existsSync(this.templateDir)) {
         console.error('');
@@ -132,20 +145,25 @@ module.exports = class extends Generator {
         process.exit(1);
       }
 
-      this.log('');
-      this.log(`📦 Creating sub-app: ${this.appName}`);
-      this.log(`   Destination: apps/${this.appName}`);
-      this.log('');
-
       this.logger.verbose('Template directory:', this.templateDir);
       this.logger.verbose('Destination directory:', this.destDir);
 
       // 在 mico_cli 根目录执行 npm view，以使用该目录 .npmrc 中的 Nexus 认证
       const cliRoot = path.resolve(__dirname, '../..');
-      this.logger.verbose('Fetching latest package versions...');
+      this.logger.verbose('Fetching latest package versions (parallel)...');
+
+      // 并行获取版本
+      const versions = await getPackageVersionsParallel(
+        [
+          { name: '@mico-platform/ui', fallback: '1.0.0' },
+          { name: '@mico-platform/theme', fallback: '1.0.0' },
+        ],
+        8000,
+        cliRoot,
+      );
 
-      const micoUiVer = getLatestNpmVersion('@mico-platform/ui', '1.0.0', 8000, cliRoot);
-      const themeVer = getLatestNpmVersion('@mico-platform/theme', '1.0.0', 8000, cliRoot);
+      const micoUiVer = versions['@mico-platform/ui'];
+      const themeVer = versions['@mico-platform/theme'];
 
       this.logger.verbose('@mico-platform/ui version:', micoUiVer);
       this.logger.verbose('@mico-platform/theme version:', themeVer);
@@ -171,6 +189,50 @@ module.exports = class extends Generator {
         process.exit(1);
       }
 
+      // Dry-run 模式：只列出文件，不实际创建
+      if (this.isDryRun) {
+        this.log('');
+        this.log('\x1b[33m📋 Dry run mode - no files will be created\x1b[0m');
+        this.log('');
+        this.log(`   Sub-app: ${this.appName}`);
+        this.log(`   Scope: ${this.packageScope}`);
+        this.log(`   Destination: apps/${this.appName}`);
+        this.log('');
+        this.log('   Would create the following files:');
+        this.log('');
+
+        let templateCount = 0;
+        let copyCount = 0;
+
+        for (const relPath of files) {
+          const destRelPath = transformDestPath(relPath);
+          const isTemplate = isTemplateFile(relPath);
+          const tag = isTemplate ? '\x1b[32m[tpl]\x1b[0m' : '\x1b[36m[cpy]\x1b[0m';
+          this.log(`   ${tag} apps/${this.appName}/${destRelPath}`);
+
+          if (isTemplate) {
+            templateCount++;
+          } else {
+            copyCount++;
+          }
+        }
+
+        this.log('');
+        this.log(`   Total: ${files.length} files (${templateCount} templates, ${copyCount} static)`);
+        this.log('');
+        this.log('   Run without --dry-run to actually create these files.');
+        this.log('');
+
+        // 设置标记以跳过后续阶段
+        this._skipInstall = true;
+        return;
+      }
+
+      this.log('');
+      this.log(`📦 Creating sub-app: ${this.appName}`);
+      this.log(`   Destination: apps/${this.appName}`);
+      this.log('');
+
       this.logger.verbose(`Processing ${files.length} files...`);
 
       let templateCount = 0;
@@ -203,6 +265,9 @@ module.exports = class extends Generator {
   }
 
   install() {
+    // 跳过 dry-run 模式
+    if (this._skipInstall) return;
+
     this.log('');
     this.log('📦 正在安装依赖...');
     this.spawnCommandSync('pnpm', ['install'], {
@@ -211,6 +276,9 @@ module.exports = class extends Generator {
   }
 
   end() {
+    // 跳过 dry-run 模式
+    if (this._skipInstall) return;
+
     this.log('');
     this.log('✅ 子应用创建成功！');
     this.log('');

package/generators/subapp-react/templates/homepage/config/config.dev.ts

@@ -2,6 +2,13 @@
 
 import { defineConfig } from '@umijs/max';
 
+/**
+ * ⚠️⚠️ 不要修改这个变量名，版本升级工具会读取这个变量名，进行版本升级
+ * @name mico-ui 版本
+ * @description 开发环境使用 mico-ui 的最新版本
+ */
+const MICO_UI_VERSION = '<%= micoUiVersionExact %>';
+
 /**
  * 开发环境配置
  * - 不配置 externals，直接打包依赖，方便独立运行调试
@@ -52,7 +59,7 @@ const config: ReturnType<typeof defineConfig> = {
    */
   styles: [
     // @mico-platform/ui 基础样式（使用运行时解析的最新版本号，避免 latest 标签）
-    'https://cdn-portal-test.micoplatform.com/portal-center/mico-ui/<%= micoUiVersionExact %>/ui/dist/css/mico-ui.min.css'
+    `https://cdn-portal.micoplatform.com/portal-center/mico-ui/${MICO_UI_VERSION}/ui/dist/css/mico-ui.min.css`,
   ],
 };
 

package/generators/subapp-react/templates/homepage/config/config.ts

@@ -102,6 +102,27 @@ const config: ReturnType<typeof defineConfig> = {
   codeSplitting: {
     jsStrategy: 'granularChunks',
   },
+
+  /**
+   * @name 额外 Babel Presets
+   * @description 使用 @mico-platform/ui 的 babel preset，实现组件与图标的按需加载
+   */
+  extraBabelPresets: ['@mico-platform/ui/babel-preset'],
+
+  /**
+   * @name MFSU 配置
+   * @description
+   * - exclude: theme 子路径解析；ui 尽量与主应用一起编译
+   * - shared: React 单例，确保 MFSU 预打包里的组件（如 UI 库）与应用共用同一份 React，否则 useContext 报 null
+   * @doc https://umijs.org/docs/guides/mfsu
+   */
+  mfsu: {
+    exclude: ['@mico-platform/theme', '@mico-platform/ui'],
+    shared: {
+      react: { singleton: true },
+      'react-dom': { singleton: true },
+    },
+  },
 };
 
 export default defineConfig(config);

package/generators/subapp-react/templates/homepage/config/routes.ts

@@ -1,6 +1,6 @@
 /**
  * @name 路由配置
- * @description homepage 子应用的路由配置
+ * @description <%= appName %> 子应用的路由配置
  */
 export default [
   { path: '/<%= appName %>', component: '@/pages/index' },

package/generators/subapp-react/templates/homepage/mock/api.mock.ts

@@ -1,6 +1,6 @@
 /**
  * @name Mock API
- * @description homepage 子应用的 Mock 数据
+ * @description <%= appName %> 子应用的 Mock 数据
  * @doc https://umijs.org/docs/guides/mock
  */
 
@@ -12,7 +12,7 @@ export default {
   //     id: 1001,
   //     name: '张三',
   //     email: 'zhangsan@example.com',
-  //     avatar: 'https://api.dicebear.com/7.x/avataaars/svg?seed=homepage',
+  //     avatar: 'https://api.dicebear.com/7.x/avataaars/svg?seed=<%= appName %>',
   //     role: 'admin',
   //     department: '技术部',
   //   },

package/generators/subapp-react/templates/homepage/package.json

@@ -17,8 +17,6 @@
   "dependencies": {
     "@mico-platform/theme": "<%= themeVersion %>",
     "@umijs/max": "^4.4.8",
-    "babel-plugin-dynamic-import-node": "^2.3.3",
-    "cross-env": "^10.1.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },
@@ -26,6 +24,9 @@
     "@mico-platform/ui": "<%= micoUiVersion %>",
     "@types/react": "^18.0.33",
     "@types/react-dom": "^18.0.11",
+    "babel-plugin-dynamic-import-node": "^2.3.3",
+    "babel-plugin-import": "^1.13.8",
+    "cross-env": "^10.1.0",
     "typescript": "^5.0.3"
   }
 }

package/generators/subapp-react/templates/homepage/src/app.tsx

@@ -1,6 +1,6 @@
 /**
  * @name 应用入口配置
- * @description homepage 子应用的运行时配置
+ * @description <%= appName %> 子应用的运行时配置
  * @doc https://umijs.org/docs/max/micro-frontend#子应用配置
  *
  * 注意：app.tsx 只能导出 Umi 规定的 API（qiankun、getInitialState 等）

package/generators/subapp-react/templates/homepage/src/common/request.ts

@@ -26,12 +26,12 @@ export async function request<T = any>(
 
   if (mainAppRequest) {
     // 微前端模式：使用主应用的 request
-    console.log('[homepage] Using main app request:', url);
+    console.log('[<%= appName %>] Using main app request:', url);
     return mainAppRequest<T>(url, options);
   }
 
   // 独立运行模式：使用 umi request
-  console.log('[homepage] Using umi request:', url);
+  console.log('[<%= appName %>] Using umi request:', url);
   // umi request 默认返回 data，skipErrorHandler 可选
   return umiRequest<T>(url, {
     skipErrorHandler: true,

package/generators/subapp-react/templates/homepage/src/global.less

@@ -20,7 +20,8 @@ body {
     'Noto Sans', sans-serif;
 }
 
-#homepage-root {
+#<%= appName %>-root {
   width: 100%;
   height: 100%;
+  background-color: var(--color-fill-1);
 }

package/generators/subapp-react/templates/homepage/src/pages/index.less

@@ -6,7 +6,7 @@
 // 导入主题变量（仅 Less 变量，子应用用）
 @import '@mico-platform/theme/variables';
 
-.homepage {
+.<%= appName %> {
   padding: @spacing-lg;
   min-height: 100vh;
   // 使用主题色变量 - 背景色会随主题切换自动变化

package/generators/subapp-react/templates/homepage/src/pages/index.tsx

@@ -135,7 +135,7 @@ export default function HomePage() {
   };
 
   return (
-    <div className="homepage">
+    <div className="<%= appName %>">
       <Title heading={2}>🎨 子应用主题 & 组件示例</Title>
       <Paragraph type="secondary">
         子应用复用主应用的 React 和 @mico-platform/ui，无重复打包，主题自动同步
@@ -316,44 +316,44 @@ export default function HomePage() {
         </Paragraph>
 
         <Title heading={6}>品牌色 & 功能色</Title>
-        <div className="homepage-colors">
-          <div className="homepage-color-item">
-            <div className="homepage-color-box brand-1" />
-            <span className="homepage-color-label">@Brand1-6</span>
+        <div className="<%= appName %>-colors">
+          <div className="<%= appName %>-color-item">
+            <div className="<%= appName %>-color-box brand-1" />
+            <span className="<%= appName %>-color-label">@Brand1-6</span>
           </div>
-          <div className="homepage-color-item">
-            <div className="homepage-color-box brand-2" />
-            <span className="homepage-color-label">@Brand2-6</span>
+          <div className="<%= appName %>-color-item">
+            <div className="<%= appName %>-color-box brand-2" />
+            <span className="<%= appName %>-color-label">@Brand2-6</span>
           </div>
-          <div className="homepage-color-item">
-            <div className="homepage-color-box success" />
-            <span className="homepage-color-label">@Success-6</span>
+          <div className="<%= appName %>-color-item">
+            <div className="<%= appName %>-color-box success" />
+            <span className="<%= appName %>-color-label">@Success-6</span>
           </div>
-          <div className="homepage-color-item">
-            <div className="homepage-color-box warning" />
-            <span className="homepage-color-label">@Warning-6</span>
+          <div className="<%= appName %>-color-item">
+            <div className="<%= appName %>-color-box warning" />
+            <span className="<%= appName %>-color-label">@Warning-6</span>
           </div>
-          <div className="homepage-color-item">
-            <div className="homepage-color-box danger" />
-            <span className="homepage-color-label">@Danger-6</span>
+          <div className="<%= appName %>-color-item">
+            <div className="<%= appName %>-color-box danger" />
+            <span className="<%= appName %>-color-label">@Danger-6</span>
           </div>
         </div>
 
         <Title heading={6} style={{ marginTop: 16 }}>
           中性色（随主题自动切换）
         </Title>
-        <div className="homepage-colors">
-          <div className="homepage-color-item">
-            <div className="homepage-color-box fill-1" />
-            <span className="homepage-color-label">@color-fill-1</span>
+        <div className="<%= appName %>-colors">
+          <div className="<%= appName %>-color-item">
+            <div className="<%= appName %>-color-box fill-1" />
+            <span className="<%= appName %>-color-label">@color-fill-1</span>
           </div>
-          <div className="homepage-color-item">
-            <div className="homepage-color-box fill-2" />
-            <span className="homepage-color-label">@color-fill-2</span>
+          <div className="<%= appName %>-color-item">
+            <div className="<%= appName %>-color-box fill-2" />
+            <span className="<%= appName %>-color-label">@color-fill-2</span>
           </div>
-          <div className="homepage-color-item">
-            <div className="homepage-color-box fill-3" />
-            <span className="homepage-color-label">@color-fill-3</span>
+          <div className="<%= appName %>-color-item">
+            <div className="<%= appName %>-color-box fill-3" />
+            <span className="<%= appName %>-color-label">@color-fill-3</span>
           </div>
         </div>
       </Card>