From 1e6e0276569e16345dab4d2fa50001795108721a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=BB=84=E6=98=8E=E5=AF=8C?= <212149997@qq.com>
Date: Wed, 25 Dec 2024 10:59:16 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E4=BC=98=E5=8C=96=E7=BB=86=E8=8A=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env                                   |   2 +-
 .gitignore                             |   1 +
 .npmrc                                 |   3 -
 README.en-US.md                        | 158 ++++++++-----------------
 README.md                              |  19 ++-
 eslint.config.js                       |   2 +-
 lint-staged.config.js                  |   6 +-
 package.json                           |   7 +-
 pnpm-lock.yaml                         |   4 +-
 src/router/utils/route-guard.tsx       |  38 ------
 src/store/modules/use-loading-store.ts |   2 +
 src/types/global.d.ts                  |   2 -
 src/utils/dateUtil.ts                  |  19 ---
 stylelint.config.js                    |   8 --
 tsconfig.json                          |   6 +-
 vite.config.ts                         |   5 +-
 16 files changed, 75 insertions(+), 207 deletions(-)
 delete mode 100644 src/router/utils/route-guard.tsx

diff --git a/.env b/.env
index cedf699..ea38e25 100644
--- a/.env
+++ b/.env
@@ -7,7 +7,7 @@
 # 这些变量在开发环境、生产环境和测试环境中都会生效。
 
 # 项目标题
-VITE_APP_TITLE = React-Ts-Template
+VITE_APP_TITLE = React-Mobile-Template
 
 # 端口号
 VITE_APP_PORT = 5173
diff --git a/.gitignore b/.gitignore
index 925987a..64e22b8 100644
--- a/.gitignore
+++ b/.gitignore
@@ -22,5 +22,6 @@ dist-ssr
 *.sln
 *.sw?
 
+.cache
 .stylelintcache
 .eslintcache
diff --git a/.npmrc b/.npmrc
index 17c7680..4acd535 100644
--- a/.npmrc
+++ b/.npmrc
@@ -1,5 +1,2 @@
 # 设置最新的淘宝镜像，加快安装依赖速度
 registry = https://registry.npmmirror.com
-
-# 安装依赖时锁定版本号
-save-exact = true
diff --git a/README.en-US.md b/README.en-US.md
index 3cfb01f..6d05e15 100644
--- a/README.en-US.md
+++ b/README.en-US.md
@@ -1,128 +1,66 @@
-GitHub Repository: [React-Ts-Template](https://github.com/huangmingfu/react-ts-template)
+# React Mobile Template
 
-In modern frontend development, we often need to quickly set up a React project. With the `create-react-app` scaffold no longer being maintained, **React-Ts-Template** was born to address this need! This is a project template built on the latest **React 19, TypeScript, and Vite 6**, designed to help you rapidly start your project and save considerable configuration time. The template integrates various development standards and popular plugins, ready to use out of the box, allowing you to focus on implementing business logic!
+GitHub Project Link: [React-Mobile-Template](https://github.com/huangmingfu/react-mobile-template)
+
+This is a **mobile project template** based on [React-Ts-Template](https://github.com/huangmingfu/react-ts-template), aimed at helping you quickly start mobile H5 projects and save a lot of repetitive configuration time. The template integrates various development specifications and popular plugins, ready to use out of the box, allowing you to focus on business logic implementation!
 
 ## Features
 
 - **Route Lazy Loading**: Implemented route lazy loading to improve page switching performance and reduce initial loading time. (See `router`)
-- **Route Guards**: Encapsulated flexible route guard management to ensure user access control and enhance application security. (See `router`)
-- **Global State Management**: Provides Zustand global state management example code, simplifying cross-component state sharing and improving development efficiency. (See `store`)
-- **Axios Request Encapsulation**: Encapsulated Axios to uniformly handle HTTP requests and responses, simplifying interaction with backend interfaces. (See `services`)
-- **Utility Functions & Hooks**: Provides some convenient and practical utility functions and hooks. (See `utils`, `hooks`)
-- **react-dev-inspector Integration**: Click on page elements to open corresponding code in IDE, facilitating code debugging and improving development efficiency. (See `vite.config.ts`)
-- **Automatic Import Order Beautification**: Integrated prettier-plugin-sort-imports plugin to automatically beautify import order, enhancing code readability and maintainability.
-- **Others**: Provides commands for convenient environment-based running and building; configured code splitting strategy; local reverse proxy for CORS; and detailed `nanny-level comments`, etc.
-
-## Technology Stack Overview
-
-### 🛠 Technology Stack Selection
-
-- **React 19 & React-DOM**: Using the latest version of React for high frontend performance and smoother user experience.
-- **React-Router**：Latest v7 version, supports lazy loading of routes, optimizes page transition performance.
-- **SCSS Preprocessing**: Fully adopts the new version of SCSS, using `@use` instead of `@import` for stronger modularity.
-- **ahooks**: Provides rich React Hooks similar to VueUse, further simplifying logic code.
-- **zustand**: Lightweight state management library. After comparing Redux, Dva, React-Toolkit, MobX, and `useContext` combined with `useReducer`, we chose the simpler Zustand.
-- **Immer**: Simplifies immutable data structure operations, especially convenient for handling deeply nested objects.
-- **es-toolkit**: A modern JavaScript utility library that provides a range of powerful functions for everyday use, with a smaller size and better performance (similar to lodash-es).
-- **Axios**: Encapsulated HTTP request library for easier backend interface integration.
-- **classnames**: Dynamic class name management tool, particularly suitable for conditional style rendering.
-- **Dayjs**: Lightweight date processing library, providing APIs similar to Moment.js but with smaller size and better performance.
-
-### 🔧 Other Recommended Tools
-
-- **Alova.js**: New generation request tool, convenient for request data management.
-- **SWR**: Another choice for data request caching and synchronization management.
+- **Route Guard**: Flexible route guard management to ensure user access control and enhance application security. (See `router`)
+- **Global State Management**: Provides Zustand global state management example code to simplify cross-component state sharing and improve development efficiency. (See `store`)
+- **Axios Request Encapsulation**: Encapsulates Axios to uniformly handle HTTP requests and responses, simplifying interaction with backend interfaces. (See `services`)
+- **Utility Functions and Hooks**: Provides convenient utility functions and hooks. (See `utils`, `hooks`)
+- **react-dev-inspector Integration**: Click page elements to open corresponding code directly in IDE, facilitating developer debugging and improving development efficiency. (See `vite.config.ts`)
+- **Automatic Import Sorting**: Integrated with prettier-plugin-sort-imports to automatically beautify import order, improving code readability and maintainability
+- **Other Features**: Provides convenient commands for environment-specific running and packaging; configured code splitting strategy; local reverse proxy to solve cross-origin issues; detailed "nanny-level comments", etc.
+
+## Technology Stack
+
+### 🛠 Technology Selection
+
+- **React 18 & React-DOM**: Using the latest React version for high-performance front-end and smoother user experience
+- **React-Router**: Latest v7 version, supporting route lazy loading and optimizing page switching performance
+- **rem**: Using rem units for mobile adaptation, ensuring consistent display across different devices
+- **antd-mobile**: Alibaba's open-source mobile component library, providing rich UI components and simplifying development process
+- **SCSS Preprocessor**: Fully adopting new SCSS version, using `@use` instead of `@import` for stronger modularity
+- **ahooks**: Provides rich React Hooks similar to VueUse, further simplifying logical code
+- **zustand**: Lightweight state management library
+- **Immer**: Simplifies immutable data structure operations
+- **es-toolkit**: Modern JavaScript utility library
+- **Axios**: HTTP request library
+- **classnames**: Dynamic class name management tool
+- **Dayjs**: Lightweight date processing library
 
 ## Project Standards and Configuration
 
-To ensure code consistency and standardization in team collaboration, **React-Ts-Template** introduces a complete set of project standards:
+To ensure code consistency and standardization during team collaboration, the project introduces:
 
-- **Full ESM Standard Usage**: Adopts modular imports, aligning with modern JavaScript development trends.
-- **Mandatory pnpm Package Manager**: Improves dependency installation speed, reduces disk space usage, and solves phantom dependency issues.
-- **BEM Style Naming Convention**: Clear structure, reduces style conflicts, improves code maintainability (CSS Modules wasn't adopted for easier style penetration, but you can use xxx.module.scss if needed).
-- **File and Folder Naming**: Uniformly uses `kebab-case`, which is most reliable, especially when sharing code through version control across different operating systems with varying case sensitivity.
+- **Full ESM Standard**: Using modular imports
+- **Package Manager**: Strictly using pnpm
+- **Style Naming Convention**: BEM naming standard
+- **File Naming**: Unified `kebab-case`
 
 ### 💡 Efficient Code Standard Management
 
-Besides code structure standardization, the project integrates various code quality inspection tools to ensure development experience and code quality:
-
-- **ESLint**: Code style and error checking, upgraded to the latest version, deprecated `.eslintignore` in favor of `ignores` configuration.
-- **Prettier**: Unified code formatting to avoid conflicts due to formatting issues in team collaboration.
-- **Stylelint**: Style-specific lint tool ensuring SCSS code consistency.
-- **Commitlint** + **Husky** + **Lint-Staged**: Works with Git Hooks to standardize code submissions and prevent low-quality code from entering the repository.
-- **EditorConfig**: Unified editor configuration to reduce issues caused by editor differences.
-
-## Project Structure
-
-```tree
-├── .vscode # VSCode editor configuration folder
-│   └── settings.json # Specific VSCode editor settings
-│   └── extensions.json # VSCode recommended plugins
-├── .husky # Husky configuration folder for managing Git hooks
-│   └── commit-msg # Commit message check hook configuration
-│   └── pre-commit # Formatting hook configuration
-├── .github # GitHub specific configuration and workflow folder
-│   └── workflows # GitHub Actions workflow configuration
-│       └── deploy.yml # Continuous integration configuration file
-├── public # Static resource directory for assets not processed by Vite
-├── src # Source code directory
-│ ├── assets # Static assets like images, fonts, etc.
-│ ├── components # Common components directory
-│ │ ├── high-light # Code highlighting component
-│ │ └── auto-scroll-to-top # Auto scroll to top component
-│ │ └── ...
-│ ├── hooks # Custom React Hooks
-│ │ └── use-design # Design-related custom Hook
-│ │ └── ...
-│ ├── layouts # Page layout components
-│ ├── views # Page components
-│ ├── router # Route configuration
-│ │ └── utils # Route-related utility functions
-│ │ └── ...
-│ ├── services # API service encapsulation
-│ ├── store # State management
-│ │ └── modules # State management modules
-│ │ │ └── use-loading-store.ts # Counter loading state management
-│ │ └── ...
-│ ├── styles # Styles
-│ ├── types # TypeScript type definitions
-│ └── utils # Utility functions
-├── .env # Environment configuration file
-├── .editorconfig # Editor configuration file for unified code style across editors
-├── eslint.config.js # ESLint configuration file for code style and error checking
-├── .prettierrc.js # Prettier configuration file for code formatting
-├── stylelint.config.js # Stylelint configuration file for style file standards
-├── .commitlintrc.js # Commitlint configuration file for Git commit message style checking
-├── lint-staged.config.js # Lint-Staged configuration file for running Linters before Git commits
-├── package.json # Project dependency configuration file
-├── tsconfig.json # TypeScript configuration file
-└── vite.config.ts # Vite configuration file for build and service options
-```
-
-## Others
-
-### 📦 About Route Caching (keep-alive)
-
-> React officially hasn't implemented functionality similar to Vue's \<keep-alive\>. React team rejected adding this feature based on two considerations, which you can search and read about. To achieve state preservation, the official team recommends these two manual state preservation methods:
-
-- Lift the state of components needing state preservation to their parent components.
-- Use CSS visible property to control the rendering of components needing state preservation, instead of using if/else, to prevent React from unmounting them.
-
-> However, there are some libraries that implement this functionality, such as react-router-cache-route, react-activation, keepalive-for-react, etc. If your project needs to handle a small amount of state caching data, it's better to follow React's official recommendations and solve state caching issues manually.
-
----
+- **ESLint**: Code style and error checking
+- **Prettier**: Unified code formatting
+- **Stylelint**: Style linting tool
+- **Commitlint + Husky + Lint-Staged**: Git Hooks for code commit standardization
+- **EditorConfig**: Unified editor configuration
 
 ## Summary
 
-The **React-Ts-Template** project template aims to reduce developers' tedious configuration steps during project initialization through preset best practice configurations, allowing you to get started with project development faster. Meanwhile, it's equipped with mature development toolchains and powerful plugin support to ensure team development consistency and code quality. If you're looking for an efficient React project template, why not try **React-Ts-Template**!
+**React-Mobile-Template** aims to reduce initial configuration steps through preset best practices, allowing developers to quickly start project development. It comes with a mature development toolchain and powerful plugin support to ensure team development consistency and high-quality code.
+
+**👉 Star the project and start your React mobile project journey!**
+
+> [React-Mobile-Template](https://github.com/huangmingfu/react-mobile-template)
 
-**👉 Star the project now and start your React project journey!**
+## Notes
 
-> [React-Ts-Template](https://github.com/huangmingfu/react-ts-template)
+1. Currently, some UI libraries do not support React 19. This project uses version 18.3.1, so be cautious when upgrading the React version.
+2. The `postcss-pxtorem` plugin does not support inline styles, so a `px2rem` function is provided in `utils` to address this. Example: `<div style={{ width: px2rem(100) }}>test</div>`
+3. The `postcss-pxtorem` plugin will not convert px to rem in the following scenarios:
 
-## Note
-> 1.Currently, some UI libraries do not support React 19. Please be cautious when installing and using them.
-> 2.This project does not use any features specific to version 19. If needed, you can directly downgrade to version 18 using the following command.
-```bash
-pnpm install react@18.3.1 react-dom@18.3.1
-```
\ No newline at end of file
+(1). When styles are imported in `main.ts`, such as `import '@/styles/scss/global.scss';`. It is recommended to import styles that do not involve px, such as `reset.css`.
diff --git a/README.md b/README.md
index d8e3518..e7e0956 100644
--- a/README.md
+++ b/README.md
@@ -19,7 +19,7 @@ GitHub 项目地址：[React-Mobile-Template](https://github.com/huangmingfu/rea
 
 ### 🛠 技术栈选型
 
-- **React 19 & React-DOM**：使用最新版 React 实现前端高性能和更流畅的用户体验。
+- **React 18 & React-DOM**：使用最新版 React 实现前端高性能和更流畅的用户体验。
 - **React-Router**：最新v7版本，支持路由懒加载，优化页面切换性能。
 - **rem**：使用 rem 单位进行移动端适配，确保在不同设备上有一致的显示效果（本项目也配置了vw参考可供开发者自行选择使用）。
 - **antd-mobile**：阿里巴巴开源的移动端组件库，提供丰富的 UI 组件，简化开发流程。
@@ -71,20 +71,15 @@ GitHub 项目地址：[React-Mobile-Template](https://github.com/huangmingfu/rea
 
 ## 总结
 
-**React-Mobile-Template** 项目模板的目标是通过预设的最佳实践配置，减少开发者在项目初始化时的琐碎配置步骤，让你可以更快上手项目开发。同时，配备了成熟的开发工具链和强大的插件支持，以确保团队开发的一致性和代码的高质量。如果你正在寻找一款高效的 React 项目模板，不妨试试 **React-Mobile-Template**！
+**React-Mobile-Template** 项目模板的目标是通过预设的最佳实践配置，减少开发者在项目初始化时的琐碎配置步骤，让你可以更快上手项目开发。同时，配备了成熟的开发工具链和强大的插件支持，以确保团队开发的一致性和代码的高质量。如果你正在寻找一款高效的 `React 移动端项目模板`，不妨试试 **React-Mobile-Template**！
 
-**👉 赶快 Star 项目，开启你的 React 项目之旅！**
+**👉 赶快 Star 项目，开启你的 React 移动端项目之旅！**
 
 > [React-Mobile-Template](https://github.com/huangmingfu/react-mobile-template)
 
 ## 注意
 
-> 1.目前有一些ui库还未支持React19，本项目使用的是18.3.1版本，谨慎升级react版本。  
-> 2.postcss-pxtorem插件不支持内联样式，所以 `utils` 里面配备了 `px2rem` 函数。示例：
-
-```ts
-<div style={{ width: px2rem(100) }}>test</div>
-```
-
-> 3. 以下场景pxtorem插件不会转换rem：  
->    (1) 在main.ts里引入样式，如 `import '@/styles/scss/global.scss';`，建议引入不涉及px的样式，如reset.css。
+1.目前有一些ui库还未支持React19，本项目使用的是18.3.1版本，谨慎升级react版本。  
+2.postcss-pxtorem插件不支持内联样式，所以 `utils` 里面配备了 `px2rem` 函数解决。示例：`<div style={{ width: px2rem(100) }}>test</div>`  
+3. 以下场景pxtorem插件不会转换rem：  
+(1).在main.ts里引入样式，如 `import '@/styles/scss/global.scss';`，建议引入不涉及px的样式，如reset.css。
diff --git a/eslint.config.js b/eslint.config.js
index 4899e66..1e32f4d 100644
--- a/eslint.config.js
+++ b/eslint.config.js
@@ -8,7 +8,7 @@ import tseslint from 'typescript-eslint';
 export default tseslint.config(
   { ignores: ['dist', 'dist*', 'node_modules'] },
   {
-    settings: { react: { version: '19.0' } },
+    settings: { react: { version: '18.3' } },
     extends: [js.configs.recommended, ...tseslint.configs.recommended],
     files: ['**/*.{ts,tsx}'],
     languageOptions: {
diff --git a/lint-staged.config.js b/lint-staged.config.js
index 6337cfa..83b172e 100644
--- a/lint-staged.config.js
+++ b/lint-staged.config.js
@@ -1,6 +1,6 @@
 /**  @type {import('lint-staged').Config} */
 export default {
-  '*.{ts,tsx,js,jsx,cjs,mjs}': 'eslint --fix',
-  '*.{css,scss,less}': 'stylelint --fix',
-  '*.{ts,tsx,js,jsx,cjs,mjs,html,css,scss,less,json}': 'prettier --write',
+  '*.{ts,tsx,js,jsx,cjs,mjs}': 'eslint --fix --cache',
+  '*.{css,scss,less}': 'stylelint --fix --cache',
+  '*.{ts,tsx,js,jsx,cjs,mjs,html,css,scss,less,json}': 'prettier --write --cache',
 };
diff --git a/package.json b/package.json
index 08010be..98d2540 100644
--- a/package.json
+++ b/package.json
@@ -33,10 +33,9 @@
     "preview:pro": "pnpm vite preview -m pro",
     "ts:check": "tsc --noEmit",
     "lint:eslint": "eslint --max-warnings 0  \"**/*.{ts,tsx,js,jsx,cjs,mjs}\" --fix --cache",
-    "lint:format": "prettier --write \"**/*.{ts,tsx,js,jsx,cjs,mjs,html,scss,css,less,json}\"",
+    "lint:format": "prettier --write --cache \"**/*.{ts,tsx,js,jsx,cjs,mjs,html,scss,css,less,json}\"",
     "lint:style": "stylelint \"**/*.{css,scss,less}\" --fix --cache",
     "lint:all": "pnpm run lint:eslint && pnpm run lint:style && pnpm run lint:format",
-    "lint:lint-staged": "lint-staged",
     "prepare": "husky install",
     "preinstall": "npx only-allow pnpm",
     "clean": "rm -rf node_modules dist dist-*",
@@ -51,8 +50,8 @@
     "dayjs": "^1.11.13",
     "es-toolkit": "^1.30.1",
     "immer": "^10.1.1",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
+    "react": "~18.3.1",
+    "react-dom": "~18.3.1",
     "react-router": "^7.1.1",
     "zustand": "^5.0.2"
   },
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 3dd3223..6156d11 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -30,10 +30,10 @@ importers:
         specifier: ^10.1.1
         version: 10.1.1
       react:
-        specifier: ^18.3.1
+        specifier: ~18.3.1
         version: 18.3.1
       react-dom:
-        specifier: ^18.3.1
+        specifier: ~18.3.1
         version: 18.3.1(react@18.3.1)
       react-router:
         specifier: ^7.1.1
diff --git a/src/router/utils/route-guard.tsx b/src/router/utils/route-guard.tsx
deleted file mode 100644
index 9f180ff..0000000
--- a/src/router/utils/route-guard.tsx
+++ /dev/null
@@ -1,38 +0,0 @@
-/**
- * 第二种实现路由守卫的方式（参考）：使用高级组件方式，监听pathname，在useEffect中作路由守卫。
- * 不确定的影响（来源网上评论）：
- * 在useEffect 里去做路由守卫的话是否会出现页面内容加载完后以及触发接口调用后才跳出页面的情况。
- *
- * React-Ts-Template 默认使用的是第一种实现方式（loader），如果更喜欢下面这种，可以根据情况修改；
- * 如果使用默认的loader实现，【可以将此文件删除】。
- *
- * 其他拦截组件封装方式参考：
- * https://segmentfault.com/a/1190000044439881
- */
-import { FC, ReactNode, useEffect } from 'react';
-import { useLocation, useNavigate } from 'react-router';
-
-export const RouteGuard: FC<{ children: ReactNode }> = (props) => {
-  const { pathname } = useLocation();
-
-  const navigate = useNavigate();
-  const token = localStorage.getItem('token') || '';
-
-  useEffect(() => {
-    if (!token) {
-      // message.error("token 过期，请重新登录!");
-      navigate('/login');
-    }
-    // 已经登录的状态
-    if (token) {
-      if (location.pathname == '/' || location.pathname == '/login') {
-        navigate('/home');
-      } else {
-        // 如果是其他路由就跳到其他的路由
-        navigate(location.pathname);
-      }
-    }
-  }, [token, pathname, navigate]);
-
-  return <>{props.children}</>;
-};
diff --git a/src/store/modules/use-loading-store.ts b/src/store/modules/use-loading-store.ts
index ffe85fd..62153ca 100644
--- a/src/store/modules/use-loading-store.ts
+++ b/src/store/modules/use-loading-store.ts
@@ -1,5 +1,7 @@
 import { create } from 'zustand';
 
+type Fn = () => void;
+
 interface State {
   count: number;
   isLoading: boolean;
diff --git a/src/types/global.d.ts b/src/types/global.d.ts
index a1cdeb8..8efac77 100644
--- a/src/types/global.d.ts
+++ b/src/types/global.d.ts
@@ -4,6 +4,4 @@ declare interface IResponse<T = unknown> {
   data: T;
 }
 
-declare type Fn = () => void;
-
 declare module 'postcss-pxtorem';
diff --git a/src/utils/dateUtil.ts b/src/utils/dateUtil.ts
index e9ec53b..af51156 100644
--- a/src/utils/dateUtil.ts
+++ b/src/utils/dateUtil.ts
@@ -27,22 +27,3 @@ export function formatToDateTime(date?: dayjs.ConfigType, format = DATE_TIME_FOR
 export function formatToDate(date?: dayjs.ConfigType, format = DATE_FORMAT): string {
   return dayjs(date).format(format);
 }
-
-/**
- * 判断指定时间是否在某个时间之前。
- * @param {string | dayjs.ConfigType} [specifiedTime] 要比较的指定时间，默认为当前时间。格式为 'YYYY-MM-DD HH:mm:ss' 或 dayjs 对象。
- * @param {string} targetTime 要比较的目标时间，格式为 'YYYY-MM-DD HH:mm:ss'。
- * @returns {boolean} 如果指定时间在目标时间之前，则返回 true，否则返回 false。
- */
-export function isTimeBefore(
-  specifiedTime: dayjs.ConfigType = dayjs(),
-  targetTime: string,
-): boolean {
-  // 将指定时间转换为 dayjs 对象
-  const specified = dayjs(specifiedTime);
-
-  // 将目标时间转换为 dayjs 对象
-  const target = dayjs(targetTime);
-
-  return specified.isBefore(target);
-}
diff --git a/stylelint.config.js b/stylelint.config.js
index ac95b16..dd9e25c 100644
--- a/stylelint.config.js
+++ b/stylelint.config.js
@@ -13,14 +13,6 @@ export default {
     'no-empty-source': null, // 关闭禁止空源码
     'selector-class-pattern': null, // 关闭强制选择器类名的格式
     'property-no-unknown': null, // 禁止未知的属性(true 为不允许)
-    'value-no-vendor-prefix': null, // 关闭 属性值前缀 --webkit-box
-    'property-no-vendor-prefix': null, // 关闭 属性前缀 -webkit-mask
-    'selector-pseudo-class-no-unknown': [
-      true,
-      {
-        ignorePseudoClasses: ['global', 'export'],
-      },
-    ],
   },
   ignoreFiles: [
     '**/*.js',
diff --git a/tsconfig.json b/tsconfig.json
index 11f6302..2a6c318 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -24,9 +24,9 @@
     /** 别名路径提示 */
     "baseUrl": ".",
     "paths": {
-      "@/*": ["./src/*"]
+      "@/*": ["src/*"]
     }
   },
-  "include": ["**/*.ts", "src/**/*.d.ts", "**/*.tsx"],
-  "exclude": ["node_modules", "dist", "dist-*"]
+  "include": ["**/*.ts", "**/*.d.ts", "**/*.tsx"],
+  "exclude": ["node_modules", "dist", "dist*"]
 }
diff --git a/vite.config.ts b/vite.config.ts
index 28debdc..e1dbbf9 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -49,7 +49,10 @@ export default defineConfig(({ mode }: ConfigEnv): UserConfig => {
             // exclude: /node_modules\/(?!antd-mobile)/ // 如果rootValue设置成了75，需要增加排除 antd-mobile 库的转换
           }),
           autoprefixer(), // 自动添加浏览器前缀
-          /** 喜欢使用vw的，可以改成vw插件"postcss-px-to-viewport" */
+          /**
+           * 喜欢使用vw的，可以改成vw插件"postcss-px-to-viewport"
+           * @see https://github.com/evrone/postcss-px-to-viewport
+           */
           // postcsspxtoviewport({
           //   unitToConvert: 'px', // 要转化的单位
           //   viewportWidth: 375, // UI设计稿的宽度, 375视口的宽度，对应的时设计稿的宽度/2，一般为750