@qlover/create-app 0.6.3 → 0.7.0

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

@@ -7,34 +7,21 @@
   "homepage": "",
   "author": "qlover",
   "license": "ISC",
-  "main": "./dist/es/index.js",
-  "module": "./dist/es/index.js",
-  "types": "./dist/es/index.d.ts",
-  "exports": {
-    ".": {
-      "types": "./dist/es/index.d.ts",
-      "import": "./dist/es/index.js",
-      "require": "./dist/cjs/index.js"
-    },
-    "./cjs/*": "./dist/cjs/*",
-    "./es/*": "./dist/es/*",
-    "./package.json": "./package.json"
-  },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/qlover/fe-base.git",
     "directory": ""
   },
   "files": [
-    "bin",
     "dist",
     "package.json",
-    "README.md"
+    "README.md",
+    "README.en.md",
+    "docs"
   ],
   "keywords": [
-    "scripts",
-    "release",
-    "fe-release"
+    "react-app",
+    "react-app-template"
   ],
   "publishConfig": {
     "access": "public"
@@ -57,7 +44,7 @@
     "@qlover/corekit-bridge": "latest",
     "@qlover/fe-corekit": "latest",
     "@qlover/logger": "^0.1.1",
-    "@qlover/slice-store-react": "^1.0.8",
+    "@qlover/slice-store-react": "^1.2.6",
     "@tailwindcss/postcss": "^4.1.8",
     "@tailwindcss/vite": "^4.1.8",
     "antd": "^5.25.3",
@@ -80,6 +67,7 @@
     "@qlover/eslint-plugin-fe-dev": "^0.2.0",
     "@qlover/fe-scripts": "latest",
     "@qlover/fe-standard": "^0.0.4",
+    "@testing-library/react": "^16.3.0",
     "@types/lodash": "^4.17.13",
     "@types/react": "^18.3.11",
     "@types/react-dom": "^18.3.0",
@@ -95,6 +83,7 @@
     "eslint-plugin-react-refresh": "^0.4.14",
     "eslint-plugin-vitest": "^0.5.4",
     "globals": "^15.12.0",
+    "jsdom": "^26.1.0",
     "postcss": "^8.5.4",
     "prettier": "^3.5.3",
     "sass-embedded": "^1.79.4",

package/dist/templates/react-app/src/base/cases/AppConfig.ts

@@ -28,6 +28,17 @@ import type { EnvConfigInterface } from '@qlover/corekit-bridge';
  * console.log(config.aiApiBaseUrl); // Value from VITE_AI_API_BASE_URL
  */
 export class AppConfig implements EnvConfigInterface {
+  constructor(
+    /**
+     * Current environment mode for Vite
+     * @description Represents the running environment (development, production, etc.)
+     * Automatically set based on the current .env file being used
+     *
+     * from vite.config `VITE_USER_NODE_ENV`
+     */
+    readonly env: string = import.meta.env.VITE_USER_NODE_ENV
+  ) {}
+
   /**
    * Application name identifier
    * @description Injected from VITE_APP_NAME environment variable
@@ -40,15 +51,6 @@ export class AppConfig implements EnvConfigInterface {
    */
   readonly appVersion = '';
 
-  /**
-   * Current environment mode for Vite
-   * @description Represents the running environment (development, production, etc.)
-   * Automatically set based on the current .env file being used
-   *
-   * from vite.config `mode`
-   */
-  readonly env: string = import.meta.env.MODE;
-
   /**
    * Storage key for user authentication token
    * @description Injected from VITE_USER_TOKEN_STORAGE_KEY environment variable
@@ -113,4 +115,9 @@ export class AppConfig implements EnvConfigInterface {
    * Project startup href, usually from window.location.href
    */
   readonly bootHref = '';
+
+  /** Flag indicating if the current environment is production */
+  get isProduction(): boolean {
+    return this.env === 'production';
+  }
 }

package/dist/templates/react-app/src/base/cases/PublicAssetsPath.ts

@@ -12,6 +12,12 @@ export class PublicAssetsPath {
   constructor(protected prefix: string = routerPrefix) {}
 
   getPath(path: string): string {
-    return this.prefix + `/${path}`;
+    if (!this.prefix) {
+      return path.startsWith('/') ? path : `/${path}`;
+    }
+    const prefix = this.prefix.endsWith('/')
+      ? this.prefix.slice(0, -1)
+      : this.prefix;
+    return prefix + (path.startsWith('/') ? path : `/${path}`);
   }
 }

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

@@ -9,6 +9,8 @@ import {
   type StoreStateInterface,
   StoreInterface
 } from '@qlover/corekit-bridge';
+import { useLocaleRoutes } from '@config/common';
+
 const { supportedLngs, fallbackLng } = i18nConfig;
 
 export type I18nServiceLocale = (typeof supportedLngs)[number];
@@ -46,8 +48,10 @@ export class I18nService
         merge({}, i18nConfig, {
           debug,
           detection: {
-            order: ['pathLanguageDetector', 'navigator'], // use custom detector
-            caches: []
+            order: useLocaleRoutes
+              ? ['pathLanguageDetector', 'navigator', 'localStorage']
+              : ['localStorage', 'navigator'],
+            caches: useLocaleRoutes ? [] : ['localStorage']
           }
         })
       );
@@ -67,8 +71,11 @@ export class I18nService
 
         return fallbackLng;
       },
-      cacheUserLanguage() {
-        // no cache, because we get language from URL
+      cacheUserLanguage(lng: string) {
+        // Only cache language if not using locale routes
+        if (!useLocaleRoutes) {
+          localStorage.setItem('i18nextLng', lng);
+        }
       }
     };
     i18n.services.languageDetector.addDetector(pathLanguageDetector);
@@ -76,6 +83,10 @@ export class I18nService
 
   async changeLanguage(language: I18nServiceLocale): Promise<void> {
     await i18n.changeLanguage(language);
+    // 如果不使用本地化路由，则保存语言设置到本地存储
+    if (!useLocaleRoutes) {
+      localStorage.setItem('i18nextLng', language);
+    }
   }
 
   changeLoading(loading: boolean): void {

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/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.3",
+  "version": "0.7.0",
   "description": "Create a new app with a single command",
   "private": false,
   "type": "module",