From 02cae30c4c7ff9ce314ae896342e903e81c38b32 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=BC=96=E7=A0=81=E7=8C=BF?= Date: Wed, 17 Sep 2025 02:31:37 +0800 Subject: [PATCH] 333 --- README.md | 77 ++++++++++++++++++++++++++++++++++++++++++++++--- doc/目录结构.md | 1 + 2 files changed, 74 insertions(+), 4 deletions(-) diff --git a/README.md b/README.md index 4d2e3bf..3acb6a9 100644 --- a/README.md +++ b/README.md @@ -1,8 +1,10 @@ ## DDD领域驱动设计的微服务前端案例 +> 持续开发中,及时拉取代码,文档还不够完善,先凑合看!!目前只是demo,代码还会进行大规模封装细化和改造! + 搭建的一套**基于DDD领域驱动设计的微服务前端**,适用于大型企业,开发大型复杂且拓展灵活的前端应用的架构方案。 -> 微服务架构中,前端用什么语言不在受约束! +> 微服务架构中,前端用什么语言不受约束,随意就好! 项目大致技术栈: - [DDD领域驱动设计](https://zh.wikipedia.org/zh-cn/%E9%A0%98%E5%9F%9F%E9%A9%85%E5%8B%95%E8%A8%AD%E8%A8%88) @@ -17,10 +19,77 @@ - [Jsx](https://legacy.reactjs.org/docs/introducing-jsx.html) - [Vite](https://cn.vite.dev/) - [axios](https://axios-http.com/) - +- 等等等.... ## 开发任务 -- [ x ] 未完成任务 + +- [x] 基于DDD理念改造 +- [ ] 基于 vite-plugin-federation 拆分领域模块为联邦模块,实现微前端 +- [ ] 领域模块实现 docker自动化构建部署上线 +- [ ] Deno集成GraphQL + +## 文件夹结构 + +**根目录:** + +```txt +. +├── back-end # 【后端】基于Deno写的后端 测试接口,仅供测试 +├── doc # 一些markdown笔记 +├── front-end # 前端 微服务 项目 +│ ├── app-car # 独立的【购物车】领域模块 +│ ├── app-product # 独立的【商品】领域模块 +│ ├── .... # 实际项目还会有更多其他的领域模块 +│ └── main-app # 主应用(入口应用) +└── README.md # 帮助文档 +``` + +**main-app 目录:** + +```txt +src/ +├── domains/ # 【核心】领域层 - 所有业务领域模块 +│ └── product/ # 订单领域模块(app-product) +│ ├── domain/ # 领域模型(充血模型) +│ │ ├── entities/ # 实体(如:Product, ProductLineItem) +│ │ ├── value-objects/ # 值对象(如:Money, Address) +│ │ ├── types/ # 领域内通用类型 +│ │ ├── enums/ # 领域枚举 +│ │ └── events/ # 领域事件(如果需要) +│ ├── application/ # 应用服务层 - 协调领域对象完成用例 +│ │ └── services/ # 应用服务(如:ProductApplicationService) +│ ├── infrastructure/ # 基础设施层 - 领域层的具体实现 +│ │ └── api/ # 数据获取实现(如:HttpProductRepository) +│ ├── ports/ # 端口(接口/抽象类)- 定义契约 +│ │ └── repositories/ # 仓储接口(如:ProductRepository) +│ └── use-cases/ # (可选)或将用例放在这里 +├── app/ # 【交付层】应用组装和配置:路由、状态管理、主布局、UI库设置、错误处理、依赖注入容器 +│ ├── components/ # 通用UI组件(与业务无关,如Button,Modal) +│ ├── layouts/ # 布局组件 +│ ├── di/ # 依赖注入配置 +│ ├── router/ # Vue Router 配置 +│ ├── stores/ # Pinia Store(用于UI状态管理,非核心业务状态) +│ └── main.ts # 应用入口,依赖注入的组装之地 +│ └── App.vue # 根组件 +├── features/ # 【交付层】基于领域的功能模块:关注具体的业务功能实现,它是舞台上的“演员”和“节目”。 +│ └── product/ # 订单功能模块(app-product) +│ ├── components/ # 订单领域专用的UI组件 +│ ├── views/ # 订单相关的页面级Vue组件 +│ ├── router/ # 订单相关的页面级Vue组件 +│ ├── composables/ # 订单相关的Vue组合式函数 +│ └── index.ts # 订单功能模块的出口 +├── shared/ # 共享资源 +│ ├── infra(infrastructure) # 基础设施层 +│ │ ├── http/ +│ ├── lib/ # 第三方库的封装/工具函数 +│ ├── utils/ # 纯工具函数 +│ └── types/ # 全局通用的TypeScript类型定义 +│ └── constants/ # 全局常量(如错误码、正则) +│ └── exceptions/ # 通用异常(如NotFoundError) +└── public/ # 静态资源目录 +└── index.html # 主HTML文件 +``` + ## 问 & 答 @@ -33,7 +102,7 @@ 问:vue3 jsx defineComponent 语法,实际项目中 setup 代码太长,怎么办? -答:使用组合式函数 (Composables) - 最推荐 +答:使用组合式函数 (Composables) 案例: diff --git a/doc/目录结构.md b/doc/目录结构.md index 5831d49..0b3051a 100644 --- a/doc/目录结构.md +++ b/doc/目录结构.md @@ -18,6 +18,7 @@ src/ ├── app/ # 【交付层】应用组装和配置:路由、状态管理、主布局、UI库设置、错误处理、依赖注入容器 │ ├── components/ # 通用UI组件(与业务无关,如Button,Modal) │ ├── layouts/ # 布局组件 +│ ├── di/ # 依赖注入配置 │ ├── router/ # Vue Router 配置 │ ├── stores/ # Pinia Store(用于UI状态管理,非核心业务状态) │ └── main.ts # 应用入口,依赖注入的组装之地