@qlover/create-app 0.4.1 → 0.4.3

package/CHANGELOG.md

@@ -1,5 +1,59 @@
 # @qlover/create-app
 
+## 0.4.3
+
+### Patch Changes
+
+#### ✨ Features
+
+- **create-app:** enhance environment configuration and localization support ([76e5e22](https://github.com/qlover/fe-base/commit/76e5e22e41fe23ce109c303ca3974103f8a85cf6)) ([#432](https://github.com/qlover/fe-base/pull/432))
+
+  - Updated .gitignore to include .env files and added .env.template to the repository.
+  - Introduced a new .env.template file for environment variable configuration in the react-app template.
+  - Enhanced package.json scripts for development modes: added staging and production modes.
+  - Updated README.md to document environment variable usage with Vite.
+  - Added new error identifiers for token handling in Error.ts and updated UserService to utilize these identifiers.
+  - Improved localization files to include new keys for error messages related to token absence.
+
+  This update improves the application's configuration management and localization, enhancing developer experience and user feedback.
+
+## 0.4.2
+
+### Patch Changes
+
+#### ✨ Features
+
+- **create-app:** enhance routing and configuration with router prefix and new services ([b32795d](https://github.com/qlover/fe-base/commit/b32795d02af4234d4708a5bdcb111bf8d2a54bd6)) ([#430](https://github.com/qlover/fe-base/pull/430))
+
+  - Introduced a router prefix in the configuration to manage asset paths and API routes more effectively.
+  - Updated the application to utilize the new RouteService for routing logic, replacing the previous RouterController.
+  - Refactored user authentication handling to use UserService, improving modularity and maintainability.
+  - Added PublicAssetsPath service to manage public asset paths dynamically based on the router prefix.
+  - Updated localization files to include additional keys and ensure consistency across languages.
+  - Modified various components to integrate the new services and ensure proper routing and asset management.
+
+  This update enhances the overall structure and flexibility of the application, paving the way for future improvements.
+
+- **create-app:** enhance login and registration features with improved localization and form handling ([a3724e5](https://github.com/qlover/fe-base/commit/a3724e5e75c8708dd00684ece563d9e1c63c0d00)) ([#430](https://github.com/qlover/fe-base/pull/430))
+
+  - Updated routing configuration to include localized titles for various pages, enhancing user experience.
+  - Added new keys for login and registration in localization files for both English and Chinese.
+  - Implemented a registration form with validation and user feedback, integrating with the UserService for account creation.
+  - Enhanced the Login component to utilize localized strings for better accessibility and clarity.
+  - Refactored the I18nService to support dynamic title updates based on the current route.
+
+  This update significantly improves the user interface and experience for authentication processes within the application.
+
+- **create-app:** refactor internationalization and store management ([c86ed98](https://github.com/qlover/fe-base/commit/c86ed9818d844d4059878c11897051a6c504a333)) ([#430](https://github.com/qlover/fe-base/pull/430))
+
+  - Updated file structure for internationalization resources, moving identifiers to a new directory for better organization.
+  - Introduced new error and i18n identifier files to enhance localization support.
+  - Refactored store management by implementing a new StoreInterface, improving state management across services.
+  - Replaced deprecated useSliceStore with a new useStore hook for better integration with the updated store architecture.
+  - Enhanced README documentation to reflect changes in project structure and build optimizations.
+
+  This update significantly improves the maintainability and scalability of the application, paving the way for future enhancements.
+
 ## 0.4.1
 
 ### Patch Changes

package/configs/_common/.gitignore.template

@@ -1,32 +1,58 @@
-# Logs
-logs
-*.log
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
-pnpm-debug.log*
-lerna-debug.log*
+.pnpm-debug.log*
+
+# local env files
+.env*.*
+!.env.template
+
+# vercel
+.vercel
 
-node_modules
-dist
-dist-ssr
-*.local
 # typescript
 *.tsbuildinfo
+next-env.d.ts
 
-# Editor directories and files
-.vscode/*
-!.vscode/extensions.json
-.idea
-.DS_Store
-*.suo
-*.ntvs*
-*.njsproj
-*.sln
-*.sw?
+.husky
+!packages/create-app/configs/_common/.husky
+public/robots.txt
+public/sitemap*.xml
+dist
+.eslintcache
+.npmrc
+.secrets
+
+# local output dir
+*.output/
 
-# lock
+# lock file
+package-lock.json
 yarn.lock
-pnpm-lock.yaml
-pnpm-lock.yml
-package-lock.json
+
+rollup.config-*.*js
+
+.nx/cache
+.nx/workspace-data

package/dist/index.js

@@ -2378,7 +2378,7 @@ var Generator = class {
 
 // package.json
 var package_default = {
-  version: "0.4.1",
+  version: "0.4.3",
   description: "Create a new app with a single command"};
 function programArgs() {
   const program = new Command();

package/package.json

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

package/templates/react-app/{.env → .env.template}

@@ -10,16 +10,15 @@ FE_RELEASE=false
 FE_RELEASE_ENV=production
 
 # ===== build
-VITE_PUBLIC_PATH=
 VITE_SERVER_PORT=3200
 
 # ===== app config
 VITE_USER_TOKEN_STORAGE_KEY=fe_user_token
 VITE_OPEN_AI_MODELS='["gpt-4o-mini","gpt-3.5-turbo","gpt-3.5-turbo-2","gpt-4","gpt-4-32k"]'
-VITE_OPEN_AI_BASE_URL=https://api.openai.com/v1
+VITE_OPEN_AI_BASE_URL=
 VITE_OPEN_AI_TOKEN=sk-proj-1234567890
 VITE_OPEN_AI_TOKEN_PREFIX=Bearer
 VITE_OPEN_AI_REQUIRE_TOKEN=true
 VITE_LOGIN_USER=admin
-VITE_LOGIN_PASSWORD=123456
+VITE_LOGIN_PASSWORD=prod-123456
 VITE_FE_API_BASE_URL=https://feapi.example.com/

package/templates/react-app/README.md

@@ -72,6 +72,25 @@ pnpm test
 - 支持服务自动注册和依赖管理
 - 提供完整的类型推导
 
+### env 配置注入
+
+[vite 环境变量和模式](https://cn.vite.dev/guide/env-and-mode#env-variables-and-modes)
+
+`vite dev` 默认 NODE_ENV 表示为 development, 他会加载可能的 `.env[mode]` 文件, 比如 .env.local -> .env
+
+`vite build`默认 NODE_ENV 表示为 production, 他会加载可能的 `.env[mode]` 文件, 比如 .env.production -> .env
+
+Nodejs NODE_ENV 只支持 development,production,test
+
+这个和 vite 中的 mode 是完全不一样的, mode 可以根据 `--mode` 指定不同模式，来加载不同的 env 配置
+
+比如:
+
+```bash
+vite dev --mode staging # 加载 .env.staging
+vite dev --mode local # 加载 .env.local
+```
+
 ### 国际化支持
 
 - 基于 i18next 的完整国际化解决方案
@@ -85,7 +104,7 @@ pnpm test
 项目使用 `@brain-toolkit/ts2locales` 插件从 TypeScript 注释自动生成国际化资源：
 
 ```typescript
-// config/Identifier.I18n.ts
+// config/Identifier/I18n.ts
 export const Messages = {
   /**
    * @description Home page welcome message
@@ -116,11 +135,11 @@ export default defineConfig({
       locales: i18nConfig.supportedLngs,
       options: [
         {
-          source: './config/Identifier.Error.ts',
+          source: './config/Identifier/Error.ts',
           target: './public/locales/{{lng}}/common.json'
         },
         {
-          source: './config/Identifier.I18n.ts',
+          source: './config/Identifier/I18n.ts',
           target: './public/locales/{{lng}}/common.json'
         }
       ]
@@ -147,7 +166,7 @@ await i18nService.changeLanguage('zh');
 
 ```typescript
 import { useBaseRoutePage } from '@/uikit/contexts/BaseRouteContext';
-import * as i18nKeys from '@config/Identifier.I18n';
+import * as i18nKeys from '@config/Identifier/I18n';
 
 function MyComponent() {
   const { t } = useBaseRoutePage();
@@ -181,8 +200,8 @@ function Header() {
 
 1. 国际化标识符管理：
 
-   - 在 `config/Identifier.I18n.ts` 中集中管理UI文本
-   - 在 `config/Identifier.Error.ts` 中集中管理错误信息
+   - 在 `config/Identifier/I18n.ts` 中集中管理UI文本
+   - 在 `config/Identifier/Error.ts` 中集中管理错误信息
    - 使用有意义的 key 命名（如：'page.home.title'）
 
 2. TypeScript 注释规范：
@@ -198,7 +217,7 @@ function Header() {
 
 4. 组件开发：
    - 使用 `useBaseRoutePage` hook 获取翻译函数
-   - 从 `@config/Identifier.I18n` 引入国际化 key
+   - 从 `@config/Identifier/I18n` 引入国际化 key
    - 避免硬编码文本，始终使用国际化 key
 
 ### 主题系统
@@ -217,7 +236,7 @@ function Header() {
 
 ```typescript
 @injectable()
-export class RequestController extends SliceStore<RequestControllerState> {
+export class RequestController extends StoreInterface<RequestControllerState> {
   constructor(
     @inject(FeApi) private readonly feApi: FeApi,
     @inject(UserApi) private readonly userApi: UserApi
@@ -375,3 +394,65 @@ const response = await api.request({
 1. 在 `public/locales` 添加翻译文件
 2. 使用 `useTranslation` hook 进行调用
 3. 支持按需加载语言包
+
+### 构建优化
+
+项目使用 Vite 进行构建，并进行了以下优化：
+
+#### 代码分割
+
+自动进行智能代码分割，将代码分为以下几个主要块：
+
+- react-vendor: React 核心库
+- antd-core: Ant Design 核心组件
+- antd-basic: 基础 UI 组件
+- antd-advanced: 高级 UI 组件
+- utils: 工具函数
+- i18n: 国际化相关
+
+#### 构建优化配置
+
+```typescript
+build: {
+  // 分块大小警告限制设置为 600kb
+  chunkSizeWarningLimit: 600,
+  // 使用 terser 进行代码压缩
+  minify: 'terser',
+  terserOptions: {
+    compress: {
+      // 移除控制台输出和调试器语句
+      drop_console: true,
+      drop_debugger: true,
+      // 移除特定的控制台函数调用
+      pure_funcs: ['console.log', 'console.info', 'console.debug']
+    }
+  }
+}
+```
+
+### 项目配置
+
+#### 环境变量
+
+- 使用 `@qlover/corekit-bridge/vite-env-config` 管理环境变量
+- 自动注入应用名称和版本信息
+- 支持环境变量前缀配置
+
+#### 样式配置
+
+- 集成 Tailwind CSS
+- 按需加载 Ant Design 组件样式
+- 支持主题模式覆盖
+
+#### 开发服务器
+
+```bash
+# 默认端口 3200，可通过环境变量配置
+VITE_SERVER_PORT=3000 pnpm dev
+```
+
+#### 测试配置
+
+- 使用 Vitest 进行单元测试
+- 支持 JSDOM 环境
+- 内置测试工具配置

package/templates/react-app/config/app.router.json

@@ -19,7 +19,7 @@
             "index": true,
             "element": "base/Home",
             "meta": {
-              "title": "fe-utils/home",
+              "title": "page.home.title",
               "icon": "home",
               "localNamespace": "common"
             }
@@ -28,7 +28,7 @@
             "path": "about",
             "element": "base/About",
             "meta": {
-              "title": "关于",
+              "title": "page.about.title",
               "icon": "info",
               "localNamespace": "common"
             }
@@ -37,7 +37,7 @@
             "path": "jsonStorage",
             "element": "base/JSONStorage",
             "meta": {
-              "title": "FE-Utils JSONStorage",
+              "title": "page.jsonstorage.title",
               "icon": "info",
               "localNamespace": "common"
             }
@@ -46,7 +46,7 @@
             "path": "request",
             "element": "base/Request",
             "meta": {
-              "title": "FE-Utils Request",
+              "title": "page.request.title",
               "icon": "info",
               "localNamespace": "common"
             }
@@ -55,7 +55,7 @@
             "path": "executor",
             "element": "base/Executor",
             "meta": {
-              "title": "FE-Utils Executor",
+              "title": "page.executor.title",
               "icon": "info",
               "localNamespace": "common"
             }
@@ -64,7 +64,7 @@
             "path": "errorIdentifier",
             "element": "base/ErrorIdentifier",
             "meta": {
-              "title": "FE-Utils ErrorIdentifier",
+              "title": "page.error_identifier.title",
               "icon": "info",
               "localNamespace": "common"
             }
@@ -74,7 +74,7 @@
             "element": "404",
             "meta": {
               "category": "common",
-              "title": "404",
+              "title": "page.404.title",
               "layout": "blank",
               "localNamespace": "common"
             }
@@ -84,7 +84,7 @@
             "element": "500",
             "meta": {
               "category": "common",
-              "title": "500",
+              "title": "page.500.title",
               "layout": "blank",
               "localNamespace": "common"
             }
@@ -107,7 +107,7 @@
             "path": "login",
             "element": "auth/Login",
             "meta": {
-              "title": "登录",
+              "title": "page.login.title",
               "icon": "info",
               "localNamespace": "common"
             }
@@ -116,7 +116,7 @@
             "path": "register",
             "element": "auth/Register",
             "meta": {
-              "title": "注册",
+              "title": "page.register.title",
               "icon": "info",
               "localNamespace": "common"
             }
@@ -129,7 +129,7 @@
         "element": "404",
         "meta": {
           "category": "common",
-          "title": "404",
+          "title": "page.404.title",
           "layout": "blank",
           "localNamespace": "common"
         }
@@ -139,7 +139,7 @@
         "element": "500",
         "meta": {
           "category": "common",
-          "title": "500",
+          "title": "page.500.title",
           "layout": "blank",
           "localNamespace": "common"
         }
@@ -149,7 +149,7 @@
         "element": "404",
         "meta": {
           "category": "common",
-          "title": "404",
+          "title": "page.404.title",
           "layout": "blank",
           "localNamespace": "common"
         }

package/templates/react-app/config/common.ts

@@ -29,3 +29,11 @@ export const loggerStyles = {
   trace: { color: '#808080' },
   log: { color: '#000000' }
 };
+
+/**
+ * 路由前缀
+ *
+ * - 需要以 / 开头
+ * - 但是不能只有 /
+ */
+export const routerPrefix = '/router-root';

package/templates/react-app/config/feapi.mock.json

@@ -8,9 +8,17 @@
     "email": "john.doe@example.com",
     "picture": "https://randomuser.me/api/portraits/men/1.jpg"
   },
+  "GET /api/userinfo": {
+    "name": "John Doe",
+    "email": "john.doe@example.com",
+    "picture": "https://randomuser.me/api/portraits/men/1.jpg"
+  },
   "POST https://feapi.example.com/api/login": {
     "token": "asdfasdf123123asdfasdf"
   },
+  "POST /api/login": {
+    "token": "/api/login-token-adfasdfasdf"
+  },
   "POST https://api.openai.com/v1/chat/completions": {
     "id": "chatcmpl-1234567890",
     "object": "chat.completion",

package/templates/react-app/config/i18n.ts

@@ -1,3 +1,5 @@
+import { routerPrefix } from './common';
+
 export default {
   fallbackLng: 'en',
   debug: false,
@@ -7,7 +9,7 @@ export default {
   ns: ['common'],
   defaultNS: 'common',
   backend: {
-    loadPath: '/locales/{{lng}}/{{ns}}.json'
+    loadPath: routerPrefix + '/locales/{{lng}}/{{ns}}.json'
   },
   supportedLngs: ['en', 'zh']
 } as const;

package/templates/react-app/config/{Identifier.Error.ts → identifier/Error.ts}

@@ -25,3 +25,10 @@ export const GLOBAL_NO_WINDOW = 'err.global.no.window';
  * @localEn Must be used in PageProvider
  */
 export const WITHIN_PAGE_PROVIDER = 'err.within.page.provider';
+
+/**
+ * @description 响应内容没有 token 值
+ * @localZh 响应内容没有 token 值
+ * @localEn Response not token value
+ */
+export const RES_NO_TOKEN = 'response.no.token';