From 829ee9a1c120ebb734545ccd671736a243357b67 Mon Sep 17 00:00:00 2001
From: MaeLucia <597445175@qq.com>
Date: Thu, 26 Feb 2026 09:13:52 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E7=8E=AF=E5=A2=83?=
=?UTF-8?q?=E5=8F=98=E9=87=8F=E9=85=8D=E7=BD=AE=E7=B3=BB=E7=BB=9F=EF=BC=8C?=
=?UTF-8?q?=E6=94=AF=E6=8C=81=E8=87=AA=E5=AE=9A=E4=B9=89=E5=BA=94=E7=94=A8?=
=?UTF-8?q?=E6=A0=87=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
- 新增 VITE_APP_TITLE 环境变量，支持自定义浏览器标题
- 添加 .env/.env.development/.env.production 配置文件
- 新增 src/config/index.ts 集中管理应用配置
- 更新 src/vite-env.d.ts 添加类型定义
- 更新 README.md 添加环境变量配置文档
- 更新 .gitignore 排除 dist.zip
---
.env | 14 ++++++
.env.development | 19 ++++++++
.env.production | 22 ++++++++++
.gitignore | 4 +-
README.md | 104 ++++++++++++++++++++++++++++++++++++++++++++
index.html | 1 +
src/config/index.ts | 54 +++++++++++++++++++++++
src/main.tsx | 5 ++-
src/vite-env.d.ts | 15 +++++++
9 files changed, 235 insertions(+), 3 deletions(-)
create mode 100644 .env
create mode 100644 .env.development
create mode 100644 .env.production
create mode 100644 src/config/index.ts
create mode 100644 src/vite-env.d.ts
diff --git a/.env b/.env
new file mode 100644
index 0000000..057a1c4
--- /dev/null
+++ b/.env
@@ -0,0 +1,14 @@
+# ========================================
+# 公共默认配置
+# ========================================
+# 此文件中的配置会作为所有环境的默认值
+# 被特定环境配置文件覆盖
+
+# 应用名称
+VITE_APP_NAME=入舍
+
+# 应用标题（浏览器标签页显示）
+VITE_APP_TITLE=入舍Demo-1.0
+
+# 应用版本
+VITE_APP_VERSION=1.0.0
diff --git a/.env.development b/.env.development
new file mode 100644
index 0000000..8814dad
--- /dev/null
+++ b/.env.development
@@ -0,0 +1,19 @@
+# ========================================
+# 开发环境配置
+# ========================================
+# 执行 npm run dev 时加载此文件
+
+# 应用基础路径 - 开发环境
+VITE_BASE_PATH=/demo/rs-demo/
+
+# 应用标题 - 开发环境
+VITE_APP_TITLE=入舍Demo-1.0
+
+# API 基础地址 - 开发环境
+VITE_API_BASE_URL=/demo/rs-demo/api
+
+# 是否启用调试模式
+VITE_DEBUG=true
+
+# 是否启用 Mock 数据
+VITE_ENABLE_MOCK=true
diff --git a/.env.production b/.env.production
new file mode 100644
index 0000000..32cc5ec
--- /dev/null
+++ b/.env.production
@@ -0,0 +1,22 @@
+# ========================================
+# 生产环境配置
+# ========================================
+# 执行 npm run build 时加载此文件
+
+# 应用基础路径 - 生产环境
+# 部署到子目录时修改此值，如: /app/ 或 /demo/
+# 部署到根目录时设置为: /
+VITE_BASE_PATH=/demo/rs-demo/
+
+# 应用标题 - 生产环境
+VITE_APP_TITLE=入舍Demo-1.0
+
+# API 基础地址 - 生产环境
+# 生产环境使用相对路径或实际 API 地址
+VITE_API_BASE_URL=/demo/rs-demo/api
+
+# 是否启用调试模式
+VITE_DEBUG=false
+
+# 是否启用 Mock 数据
+VITE_ENABLE_MOCK=true
diff --git a/.gitignore b/.gitignore
index 697175d..8ecc8f2 100644
--- a/.gitignore
+++ b/.gitignore
@@ -9,6 +9,7 @@ coverage
# Production
dist
build
+dist.zip
# Misc
.DS_Store
@@ -19,8 +20,7 @@ npm-debug.log*
yarn-debug.log*
yarn-error.log*
-# Local env files
-.env
+# Local env files (包含敏感信息，不提交)
.env.local
.env.development.local
.env.test.local
diff --git a/README.md b/README.md
index 2bb977f..3da3af8 100644
--- a/README.md
+++ b/README.md
@@ -152,6 +152,110 @@ npm run preview
---
+## ⚙️ 环境变量配置
+
+项目使用 Vite 内置的环境变量系统，支持多环境配置。所有环境变量均以 `VITE_` 前缀开头，可在代码中通过 `import.meta.env` 访问。
+
+### 配置文件说明
+
+| 文件 | 说明 | 加载时机 |
+|------|------|----------|
+| `.env` | 公共默认配置 | 所有环境 |
+| `.env.development` | 开发环境配置 | `npm run dev` |
+| `.env.production` | 生产环境配置 | `npm run build` |
+| `.env.local` | 本地覆盖配置（不提交Git） | 所有环境 |
+
+### 配置项详解
+
+#### 基础配置
+
+| 变量名 | 说明 | 默认值 | 示例 |
+|--------|------|--------|------|
+| `VITE_APP_NAME` | 应用名称 | `入舍智能家装` | `入舍智能家装` |
+| `VITE_APP_TITLE` | 浏览器标签页标题 | `入舍 - 智能家装` | `入舍Demo-1.0` |
+| `VITE_APP_VERSION` | 应用版本号 | `1.0.0` | `1.0.0` |
+
+#### 路径配置
+
+| 变量名 | 说明 | 默认值 | 示例 |
+|--------|------|--------|------|
+| `VITE_BASE_PATH` | 应用部署基础路径 | `/` | `/demo/rs-demo/` |
+| `VITE_API_BASE_URL` | API 接口基础地址 | `/api` | `/demo/rs-demo/api` |
+
+#### 调试配置
+
+| 变量名 | 说明 | 默认值 | 可选值 |
+|--------|------|--------|--------|
+| `VITE_DEBUG` | 是否启用调试模式 | `false` | `true` / `false` |
+| `VITE_ENABLE_MOCK` | 是否启用 Mock 数据 | `false` | `true` / `false` |
+
+### 使用示例
+
+#### 修改应用标题
+
+在 `.env.development` 或 `.env.production` 中设置：
+
+```env
+# 开发环境标题
+VITE_APP_TITLE=入舍Demo-1.0
+
+# 生产环境标题
+VITE_APP_TITLE=入舍 - 智能家装
+```
+
+#### 配置部署路径
+
+当应用部署到子目录时，需要配置基础路径：
+
+```env
+# 部署到子目录 /demo/rs-demo/
+VITE_BASE_PATH=/demo/rs-demo/
+VITE_API_BASE_URL=/demo/rs-demo/api
+
+# 部署到根目录
+VITE_BASE_PATH=/
+VITE_API_BASE_URL=/api
+```
+
+#### 在代码中使用
+
+```typescript
+import { APP_TITLE, APP_CONFIG } from '@/config'
+
+// 获取应用标题
+console.log(APP_TITLE) // 输出: 入舍Demo-1.0
+
+// 获取完整配置
+console.log(APP_CONFIG.base.title)
+console.log(APP_CONFIG.api.baseURL)
+```
+
+### 配置优先级
+
+环境变量按以下优先级加载（从高到低）：
+
+1. `.env.[mode].local` - 本地环境特定配置（不提交Git）
+2. `.env.[mode]` - 环境特定配置
+3. `.env.local` - 本地通用配置（不提交Git）
+4. `.env` - 公共默认配置
+
+### Fallback 机制
+
+所有配置项均内置默认值，当环境变量未设置时自动使用：
+
+```typescript
+// src/config/index.ts
+export const APP_CONFIG = {
+ base: {
+ title: import.meta.env.VITE_APP_TITLE || '入舍 - 智能家装',
+ // ...
+ },
+ // ...
+}
+```
+
+---
+
## 📱 功能演示
### 首页模块
diff --git a/index.html b/index.html
index f5d30f4..719f143 100644
--- a/index.html
+++ b/index.html
@@ -6,6 +6,7 @@
入舍 - 智能家装
+
diff --git a/src/config/index.ts b/src/config/index.ts
new file mode 100644
index 0000000..254f6b9
--- /dev/null
+++ b/src/config/index.ts
@@ -0,0 +1,54 @@
+/**
+ * 应用配置文件
+ *
+ * 集中管理应用的全局配置参数
+ * 环境变量按以下优先级加载（从高到低）：
+ * - .env.[mode].local (本地环境特定配置，不提交到 git)
+ * - .env.[mode] (环境特定配置)
+ * - .env.local (本地通用配置，不提交到 git)
+ * - .env (公共默认配置)
+ *
+ * @example
+ * // 获取基础路径
+ * import { BASE_PATH, APP_CONFIG } from '@/config'
+ * console.log(BASE_PATH) // '/demo/rs-demo/' (开发) 或 '/' (生产)
+ */
+
+export const APP_CONFIG = {
+ base: {
+ path: import.meta.env.VITE_BASE_PATH || '/',
+ name: import.meta.env.VITE_APP_NAME || '入舍智能家装',
+ title: import.meta.env.VITE_APP_TITLE || '入舍 - 智能家装',
+ version: import.meta.env.VITE_APP_VERSION || '1.0.0',
+ },
+
+ router: {
+ basename: (import.meta.env.VITE_BASE_PATH || '/').replace(/\/$/, ''),
+ },
+
+ api: {
+ baseURL: import.meta.env.VITE_API_BASE_URL || '/api',
+ },
+
+ debug: {
+ enabled: import.meta.env.VITE_DEBUG === 'true',
+ enableMock: import.meta.env.VITE_ENABLE_MOCK === 'true',
+ },
+
+ env: {
+ isDev: import.meta.env.DEV,
+ isProd: import.meta.env.PROD,
+ mode: import.meta.env.MODE,
+ },
+} as const
+
+export const BASE_PATH = APP_CONFIG.base.path
+export const ROUTER_BASENAME = APP_CONFIG.router.basename
+export const APP_NAME = APP_CONFIG.base.name
+export const APP_TITLE = APP_CONFIG.base.title
+export const APP_VERSION = APP_CONFIG.base.version
+export const API_BASE_URL = APP_CONFIG.api.baseURL
+export const IS_DEBUG = APP_CONFIG.debug.enabled
+export const ENABLE_MOCK = APP_CONFIG.debug.enableMock
+
+export type AppConfig = typeof APP_CONFIG
diff --git a/src/main.tsx b/src/main.tsx
index 43ea122..33b7aca 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -3,11 +3,14 @@ import ReactDOM from 'react-dom/client'
import { BrowserRouter } from 'react-router-dom'
import App from './App'
import ThemeProvider from './components/ThemeProvider'
+import { ROUTER_BASENAME, APP_TITLE } from './config'
import './index.css'
+document.title = APP_TITLE
+
ReactDOM.createRoot(document.getElementById('root')!).render(
-
+
diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts
new file mode 100644
index 0000000..a0ce50b
--- /dev/null
+++ b/src/vite-env.d.ts
@@ -0,0 +1,15 @@
+///
+
+interface ImportMetaEnv {
+ readonly VITE_BASE_PATH: string
+ readonly VITE_APP_NAME: string
+ readonly VITE_APP_TITLE: string
+ readonly VITE_APP_VERSION: string
+ readonly VITE_API_BASE_URL: string
+ readonly VITE_DEBUG: string
+ readonly VITE_ENABLE_MOCK: string
+}
+
+interface ImportMeta {
+ readonly env: ImportMetaEnv
+}