@qlover/create-app 0.6.2 → 0.7.0

package/dist/templates/react-app/src/base/services/RouteService.ts

@@ -14,11 +14,20 @@ export type RouterServiceDependencies = {
 
 export type RouterServiceOptions = {
   routes: RouteConfigValue[];
+  /**
+   * Whether to use locale routes
+   *
+   * @default `false`
+   */
+  hasLocalRoutes?: boolean;
   logger: LoggerInterface;
 };
 
 export class RouterServiceState implements StoreStateInterface {
-  constructor(public routes: RouteConfigValue[] = []) {}
+  constructor(
+    public routes: RouteConfigValue[] = [],
+    public localeRoutes: boolean = false
+  ) {}
 }
 
 export class RouteService
@@ -31,7 +40,9 @@ export class RouteService
   dependencies?: RouterServiceDependencies;
 
   constructor(private options: RouterServiceOptions) {
-    super(() => new RouterServiceState(options.routes));
+    super(
+      () => new RouterServiceState(options.routes, !!options.hasLocalRoutes)
+    );
   }
 
   get logger(): LoggerInterface {
@@ -51,8 +62,11 @@ export class RouteService
   }
 
   composePath(path: string): string {
-    const targetLang = I18nService.getCurrentLanguage();
-    return `/${targetLang}${path}`;
+    if (this.state.localeRoutes) {
+      const targetLang = I18nService.getCurrentLanguage();
+      return `/${targetLang}${path}`;
+    }
+    return path.startsWith('/') ? path : `/${path}`;
   }
 
   /**
@@ -70,13 +84,19 @@ export class RouteService
   }
 
   changeRoutes(routes: RouteConfigValue[]): void {
-    this.emit({ routes });
+    this.emit({ routes, localeRoutes: this.state.localeRoutes });
   }
 
-  goto(path: string, options?: NavigateOptions): void {
+  goto(
+    path: string,
+    options?: NavigateOptions & {
+      navigate?: NavigateFunction;
+    }
+  ): void {
+    const { navigate, ...rest } = options || {};
     path = this.composePath(path);
     this.logger.debug('Goto path => ', path);
-    this.navigate?.(path, options);
+    (navigate || this.navigate)?.(path, rest);
   }
 
   gotoLogin(): void {
@@ -86,4 +106,20 @@ export class RouteService
   replaceToHome(): void {
     this.goto('/', { replace: true });
   }
+
+  redirectToDefault(navigate: NavigateFunction): void {
+    this.goto('/', { replace: true, navigate });
+  }
+
+  i18nGuard(lng: string, navigate: NavigateFunction): void {
+    if (!this.state.localeRoutes) {
+      return;
+    }
+
+    if (!lng) {
+      this.goto('/404', { replace: true, navigate });
+    } else if (!I18nService.isValidLanguage(lng)) {
+      this.goto('/404', { replace: true, navigate });
+    }
+  }
 }

package/dist/templates/react-app/src/core/bootstraps/BootstrapApp.ts

@@ -1,34 +1,52 @@
-import { Bootstrap } from '@qlover/corekit-bridge';
+import {
+  Bootstrap,
+  IOCContainerInterface,
+  IOCFunctionInterface
+} from '@qlover/corekit-bridge';
 import { envBlackList, envPrefix, browserGlobalsName } from '@config/common';
-import { IOC } from '../IOC';
 import * as globals from '../globals';
-import { GLOBAL_NO_WINDOW } from '@config/Identifier/common.error';
 import { IocRegisterImpl } from '../registers/IocRegisterImpl';
 import { BootstrapsRegistry } from './BootstrapsRegistry';
+import { isObject } from 'lodash';
+import { IOCIdentifierMap } from '../IOC';
+
+export type BootstrapAppArgs = {
+  /**
+   * 启动的根节点，通常是window
+   */
+  root: unknown;
+  /**
+   * 启动的web地址
+   */
+  bootHref: string;
+  /**
+   * IOC容器
+   */
+  IOC: IOCFunctionInterface<IOCIdentifierMap, IOCContainerInterface>;
+};
 
 export class BootstrapApp {
-  static async main(): Promise<void> {
-    const root = window;
+  static async main(args: BootstrapAppArgs): Promise<BootstrapAppArgs> {
+    const { root, bootHref, IOC } = args;
 
-    if (!(typeof root !== 'undefined' && root instanceof Window)) {
-      throw new Error(GLOBAL_NO_WINDOW);
+    if (!isObject(root)) {
+      throw new Error('root is not an object');
     }
 
     const { logger, appConfig } = globals;
-    const { pathname } = root.location;
 
     const bootstrap = new Bootstrap({
       root,
       logger,
       ioc: {
         manager: IOC,
-        register: new IocRegisterImpl({ pathname, appConfig })
+        register: new IocRegisterImpl({ pathname: bootHref, appConfig })
       },
       envOptions: {
         target: appConfig,
         source: {
           ...import.meta.env,
-          [envPrefix + 'BOOT_HREF']: root.location.href
+          [envPrefix + 'BOOT_HREF']: bootHref
         },
         prefix: envPrefix,
         blackList: envBlackList
@@ -49,7 +67,10 @@ export class BootstrapApp {
 
       await bootstrap.use(bootstrapsRegistry.register()).start();
     } catch (error) {
+      console.log(error);
       logger.error(`${appConfig.appName} starup error:`, error);
     }
+
+    return args;
   }
 }

package/dist/templates/react-app/src/core/bootstraps/BootstrapsRegistry.ts

@@ -33,7 +33,7 @@ export class BootstrapsRegistry {
       IOC(I18nKeyErrorPlugin)
     ];
 
-    if (this.appConfig.env !== 'production') {
+    if (!this.appConfig.isProduction) {
       bootstrapList.push(printBootstrap);
     }
 

package/dist/templates/react-app/src/core/globals.ts

@@ -16,8 +16,6 @@ import { DialogHandler } from '@/base/cases/DialogHandler';
 import { loggerStyles } from '@config/common';
 import { AppConfig } from '@/base/cases/AppConfig';
 
-const isProduction = import.meta.env.VITE_USER_NODE_ENV === 'production';
-
 export const appConfig = new AppConfig();
 
 export const dialogHandler = new DialogHandler();
@@ -27,7 +25,7 @@ export const dialogHandler = new DialogHandler();
  */
 export const logger = new Logger({
   handlers: new ConsoleHandler(new ColorFormatter(loggerStyles)),
-  silent: isProduction,
+  silent: appConfig.isProduction,
   level: 'debug'
 });
 

package/dist/templates/react-app/src/core/registers/RegisterCommon.ts

@@ -16,7 +16,8 @@ import { themeConfig } from '@config/theme';
 import { localStorage, logger } from '../globals';
 import { I18nService } from '@/base/services/I18nService';
 import { RouteService } from '@/base/services/RouteService';
-import { baseRoutes } from '@config/app.router';
+import { baseRoutes, baseNoLocaleRoutes } from '@config/app.router';
+import { useLocaleRoutes } from '@config/common';
 import { UserService } from '@/base/services/UserService';
 import { IOCRegister } from '../IOC';
 import { IOCIdentifier } from '@config/IOCIdentifier';
@@ -62,8 +63,9 @@ export const RegisterCommon: IOCRegister = {
     container.bind(
       RouteService,
       new RouteService({
-        routes: baseRoutes,
-        logger
+        routes: useLocaleRoutes ? baseRoutes : baseNoLocaleRoutes,
+        logger,
+        hasLocalRoutes: useLocaleRoutes
       })
     );
 

package/dist/templates/react-app/src/main.tsx

@@ -4,8 +4,13 @@ import { StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
 import App from './App.tsx';
 import { BootstrapApp } from './core/bootstraps/BootstrapApp';
+import { IOC } from './core/IOC.ts';
 
-BootstrapApp.main();
+BootstrapApp.main({
+  root: window,
+  bootHref: window.location.href,
+  IOC: IOC
+});
 
 createRoot(document.getElementById('root')!).render(
   <StrictMode>

package/dist/templates/react-app/src/pages/404.tsx

@@ -8,7 +8,6 @@ export default function NotFound({ route }: { route?: string }) {
     <div className="flex flex-col justify-center min-h-screen py-6 bg-background sm:py-12">
       <div className="relative py-3 mx-auto sm:max-w-xl">
         <h1 className="text-text text-2xl font-bold text-center">
-          404 -
           {route ? `${t(NOT_FOUND_COMPONENT)}: ${route}` : t(PAGE_404_TITLE)}
         </h1>
       </div>

package/dist/templates/react-app/src/pages/500.tsx

@@ -7,7 +7,7 @@ export default function NotFound500() {
     <div className="flex flex-col justify-center min-h-screen py-6 bg-background sm:py-12">
       <div className="relative py-3 mx-auto sm:max-w-xl">
         <h1 className="text-text text-2xl font-bold text-center">
-          500 - {t(PAGE_500_TITLE)}
+          {t(PAGE_500_TITLE)}
         </h1>
       </div>
     </div>

package/dist/templates/react-app/src/pages/base/RedirectPathname.tsx

@@ -1,3 +1,5 @@
+import { RouteService } from '@/base/services/RouteService';
+import { IOC } from '@/core/IOC';
 import { useEffect } from 'react';
 import { useNavigate } from 'react-router-dom';
 
@@ -6,7 +8,7 @@ const RedirectToDefault = () => {
 
   useEffect(() => {
     // Redirect to the default language path
-    navigate('/en', { replace: true });
+    IOC(RouteService).redirectToDefault(navigate);
   }, [navigate]);
 
   return null;

package/dist/templates/react-app/src/styles/css/antd-themes/dark.css

@@ -37,7 +37,9 @@
   /* Antd 基础变量 */
   --fe-color-bg-container: rgb(30 41 59);
   --fe-color-bg-elevated: rgb(51 65 85);
-  --fe-color-text-heading: rgb(241 245 249); /* slate-100 用于暗色主题标题文本 */
+  --fe-color-text-heading: rgb(
+    241 245 249
+  ); /* slate-100 用于暗色主题标题文本 */
   --fe-color-text: rgba(255, 255, 255, 0.85);
   --fe-color-text-secondary: rgba(255, 255, 255, 0.45);
   --fe-color-text-tertiary: rgba(255, 255, 255, 0.35);

package/dist/templates/react-app/src/styles/css/antd-themes/index.css

@@ -1,3 +1,3 @@
 @import './_default.css';
 @import './dark.css';
-@import './pink.css';
+@import './pink.css';

package/dist/templates/react-app/src/styles/css/antd-themes/pink.css

@@ -4,7 +4,12 @@
   --fe-color-primary: #f472b6; /* pink-400 */
   --fe-color-primary-hover: #ec4899; /* pink-500 */
   --fe-color-primary-active: #db2777; /* pink-600 */
-  --fe-color-primary-bg: rgba(244, 114, 182, 0.1); /* pink-400 with 0.1 opacity */
+  --fe-color-primary-bg: rgba(
+    244,
+    114,
+    182,
+    0.1
+  ); /* pink-400 with 0.1 opacity */
   --fe-color-primary-border: #f472b6; /* pink-400 */
   --fe-color-primary-text: #f472b6; /* pink-400 */
   --fe-color-primary-text-hover: #ec4899; /* pink-500 */

package/dist/templates/react-app/src/styles/css/page.css

@@ -8,4 +8,4 @@
   --color-border: rgba(var(--color-border));
   --color-brand: rgba(var(--color-brand));
   --color-brand-hover: rgba(var(--color-brand-hover));
-}
+}

package/dist/templates/react-app/src/uikit/components/BaseHeader.tsx

@@ -11,7 +11,10 @@ export default function BaseHeader({
   showLogoutButton?: boolean;
 }) {
   return (
-    <header className="h-14 bg-secondary border-b border-border sticky top-0 z-50">
+    <header
+      data-testid="base-header"
+      className="h-14 bg-secondary border-b border-border sticky top-0 z-50"
+    >
       <div className="flex items-center justify-between h-full px-4 mx-auto max-w-7xl">
         <div className="flex items-center">
           <LocaleLink
@@ -19,11 +22,15 @@ export default function BaseHeader({
             className="flex items-center hover:opacity-80 transition-opacity"
           >
             <img
+              data-testid="base-header-logo"
               src={IOC(PublicAssetsPath).getPath('/logo.svg')}
               alt="logo"
               className="h-8 w-auto"
             />
-            <span className="ml-2 text-lg font-semibold text-text">
+            <span
+              data-testid="base-header-app-name"
+              className="ml-2 text-lg font-semibold text-text"
+            >
               {IOC('AppConfig').appName}
             </span>
           </LocaleLink>

package/dist/templates/react-app/src/uikit/components/LocaleLink.tsx

@@ -1,5 +1,6 @@
 import { LinkProps, Link as RouterLink, To, useParams } from 'react-router-dom';
 import { ReactNode } from 'react';
+import { useLocaleRoutes } from '@config/common';
 
 interface LocaleLinkProps extends Omit<LinkProps, 'href' | 'to'> {
   href: string | To;
@@ -21,19 +22,20 @@ const LocaleLink: React.FC<LocaleLinkProps> = ({
   locale = locale || lng;
 
   const isDefaultLocale = locale === defaultLocale;
+  const shouldAddLocale = useLocaleRoutes && !isDefaultLocale;
 
   let localizedHref: string | To;
   if (typeof href === 'string') {
-    localizedHref = isDefaultLocale ? href : `/${locale}${href}`;
+    localizedHref = shouldAddLocale ? `/${locale}${href}` : href;
   } else {
     localizedHref = {
       ...href,
-      pathname: isDefaultLocale ? href.pathname : `/${locale}${href.pathname}`
+      pathname: shouldAddLocale ? `/${locale}${href.pathname}` : href.pathname
     };
   }
 
   return (
-    <RouterLink {...props} to={localizedHref}>
+    <RouterLink data-testid="locale-link" {...props} to={localizedHref}>
       {children}
     </RouterLink>
   );

package/dist/templates/react-app/src/uikit/hooks/useI18nGuard.ts

@@ -1,4 +1,6 @@
-import { I18nService, I18nServiceLocale } from '@/base/services/I18nService';
+import { I18nServiceLocale } from '@/base/services/I18nService';
+import { RouteService } from '@/base/services/RouteService';
+import { IOC } from '@/core/IOC';
 import { useEffect } from 'react';
 import { useNavigate } from 'react-router-dom';
 import { useParams } from 'react-router-dom';
@@ -15,10 +17,6 @@ export function useI18nGuard() {
   const navigate = useNavigate();
 
   useEffect(() => {
-    if (!lng) {
-      navigate('/404', { replace: true });
-    } else if (!I18nService.isValidLanguage(lng)) {
-      navigate('/404', { replace: true });
-    }
+    IOC(RouteService).i18nGuard(lng as I18nServiceLocale, navigate);
   }, [lng, navigate]);
 }

package/dist/templates/react-app/tsconfig.json

@@ -2,7 +2,8 @@
   "files": [],
   "references": [
     { "path": "./tsconfig.app.json" },
-    { "path": "./tsconfig.node.json" }
+    { "path": "./tsconfig.node.json" },
+    { "path": "./tsconfig.test.json" }
   ],
   "compilerOptions": {
     "experimentalDecorators": true

package/dist/templates/react-app/tsconfig.test.json

@@ -0,0 +1,13 @@
+{
+  "extends": "./tsconfig.app.json",
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "types": ["vitest/globals", "vite/client"],
+    "paths": {
+      "@/*": ["./src/*"],
+      "@config/*": ["./config/*"]
+    }
+  },
+  "include": ["__tests__/**/*"],
+  "exclude": ["node_modules", "dist"]
+} 

package/dist/templates/react-app/vite.config.ts

@@ -8,7 +8,7 @@ import {
 } from './config/common';
 import { name, version } from './package.json';
 import tsconfigPaths from 'vite-tsconfig-paths';
-import envConfig from '@qlover/corekit-bridge/vite-env-config';
+import envConfig from '@qlover/corekit-bridge/build/vite-env-config';
 import ts2Locales from '@brain-toolkit/ts2locales/vite';
 import i18nConfig from './config/i18n';
 import tailwindcss from '@tailwindcss/vite';
@@ -120,8 +120,9 @@ export default defineConfig({
     port: Number(process.env.VITE_SERVER_PORT || 3200)
   },
   test: {
+    watch: false,
     environment: 'jsdom',
     globals: true,
-    setupFiles: ['./src/setupTests.ts']
+    setupFiles: ['./__tests__/setup/index.ts']
   }
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@qlover/create-app",
-  "version": "0.6.2",
+  "version": "0.7.0",
   "description": "Create a new app with a single command",
   "private": false,
   "type": "module",