Skip to content

状态与配置流

本文说明 art-design-pro-ui 中状态和配置的来源。它适合在排查“配置已修改但页面未生效”“刷新后状态丢失”“菜单或语言不一致”等问题时阅读。

状态模块

前端状态集中在 src/store/modules

模块职责
user.ts登录状态、Access Token、用户信息、语言设置
menu.ts菜单数据、菜单选中状态、路由菜单映射
site-settings.ts后端公开站点配置与管理端站点配置
setting.ts布局、主题、顶部栏、设置面板相关状态
notification.ts通知相关状态
table.ts表格偏好与列配置状态
worktab.ts工作标签页状态

配置来源

前端配置主要来自三类来源:

来源示例适用内容
环境变量.env.development.env.production端口、基础路径、API 地址、代理目标
静态配置src/config/index.tssrc/config/setting.tssrc/config/modules/*默认主题、布局、顶部栏、快捷入口、全局搜索
后端公开配置site-settings store站点名称、欢迎文案、默认语言、注册开关等

站点配置加载顺序

应用启动后会加载公开站点配置。未登录时,语言也会根据站点配置中的默认语言进行设置。

mermaid
flowchart TD
  A["main.ts 启动应用"] --> B["加载 Pinia / Router / i18n"]
  B --> C["loadPublicSiteSettings()"]
  C --> D["写入 site-settings store"]
  D --> E["未登录时同步默认语言"]
  E --> F["页面读取站点展示配置"]

因此,品牌文案、默认语言等展示问题需要同时检查前端默认配置和后端公开站点配置。

环境变量与接口地址

开发环境常见配置:

txt
VITE_API_URL = /
VITE_API_PROXY_URL = http://localhost:13000

生产环境常见配置:

txt
VITE_BASE_URL = /
VITE_API_URL = https://www.app.artd.pro

理解方式:

  • VITE_BASE_URL 影响静态资源和路由基础路径。
  • VITE_API_URL 影响请求基础地址。
  • VITE_API_PROXY_URL 只影响开发服务器代理目标。

排查建议

现象优先检查
页面文案没有变化后端公开站点配置、浏览器缓存、前端默认配置
默认语言不符合预期本地持久化语言、站点配置 defaultLanguage、语言包 key
开发环境接口不通VITE_API_URLVITE_API_PROXY_URL、后端端口
生产环境资源 404VITE_BASE_URL 与部署路径是否一致
刷新后登录状态异常Refresh Token Cookie、代理、withCredentials

维护建议

  • 环境差异放在 .env* 中,不要写进业务页面。
  • 项目默认展示值放在 src/config 中,运行时可变展示值优先走站点配置。
  • 多处页面共享的状态应进入 store,避免页面间通过临时变量同步。
  • 可复用的业务逻辑优先沉淀为 hooks 或 utils,再由页面组合使用。

根据 MIT 许可证发布