frontend-store
Installation
SKILL.md
前端数据状态流转规范
本项目的前端层使用 Vue 3 新基建 Pinia 做跨级状态管理。禁止引入和使用其它状态管理库(如 Vuex)。
Store 的组织体系
系统的状态空间划分为两类模块:
- 核心公共状态(Framework Store):位于
packages/stores/src/modules/及相关目录内。(如access,user,tabbar,dict)。 - 应用业务状态(App Store):位于
apps/web-antd/src/store/内。(如auth.ts等有关应用具体的登录校验、系统级交互流转状态)。
编写规范与设计模式
1. 采用 Setup Store 组合式范式(推荐)
若要写复杂的业务逻辑 store 优先考虑该方式:
import { defineStore } from 'pinia';
import { ref, computed } from 'vue';
Related skills
More from kevinqpeng/proxy-skills
proxy-backend-api-design
>-
6proxy-backend-database
>-
5proxy-backend-global
>-
4proxy-backend-impl-workflow
>-
4frontend-api
前端 API 对接规范,包含文件存放结构、requestClient 请求封装、namespace 类型定义、接口方法命名约定。适用于基于 vue-vben-admin v5 + @vben/request 的项目。当需要新建或修改 API 文件、定义接口类型、调用后端接口时使用此技能。
2proxy-app-global
Proxy2.0 移动端全局编码规范:uni-app + Vue 3 项目结构、命名规范、组件规范、API 封装、Store 管理、页面路由、多端适配。Use when: (1) Creating or modifying any code in proxy2.0-app project, (2) Writing pages, components, API files, or store modules, (3) Configuring pages.json or manifest.json, (4) Working with uni-app multi-platform features (H5/小程序/App), (5) Following project structure and coding standards.
2