# guigu-shp-mall-mp **Repository Path**: guigu-fe/guigu-shp-mall-mp ## Basic Information - **Project Name**: guigu-shp-mall-mp - **Description**: 尚品汇小程序版本,使用微信原生开发 - **Primary Language**: Unknown - **License**: MIT - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 3 - **Forks**: 3 - **Created**: 2023-04-04 - **Last Updated**: 2024-05-23 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README # 尚品汇小程序 尚品汇小程序 零售小程序采用 [TDesign 企业级设计体系小程序解决方案](https://tdesign.tencent.com/miniprogram/overview) 进行搭建,依赖 [TDesign 微信小程序组件库](https://github.com/Tencent/tdesign-miniprogram),涵盖完整的基本零售场景需求。 ## :pushpin: 项目介绍 ### 1. 业务介绍 尚品汇小程序涵盖了电商的黄金链路流程,从商品->购物车->结算->订单等。小程序总共包含 28 个完整的页面,涵盖首页,商品详情页,个人中心,售后流程等基础页面。采用 mock 数据进行展示,提供了完整的零售商品展示、交易与售后流程。页面详情: 模版小程序页面详情 主要页面截图如下:

example-home example-sort example-cart example-user-center example-goods-detail example-pay example-order example-order-detail

### 2. 项目构成 零售行业模版小程序采用基础的 JavaScript + WXSS + ESLint 进行构建,降低了使用门槛。 项目目录结构如下: ``` |-- tdesign-miniprogram-starter |-- README.md |-- app.js |-- app.json |-- app.wxss |-- components // 公共组件库 |-- config // 基础配置 |-- custom-tab-bar // 自定义 tabbar |-- model // mock 数据 |-- pages | |-- cart // 购物车相关页面 | |-- coupon // 优惠券相关页面 | |-- goods // 商品相关页面 | |-- home // 首页 | |-- order // 订单售后相关页面 | |-- promotion-detail // 营销活动页面 | |-- usercenter // 个人中心及收货地址相关页面 |-- services // 请求接口 |-- style // 公共样式与iconfont |-- utils // 工具库 ``` ### 3. 数据模拟 零售小程序采用真实的接口数据,模拟后端返回逻辑,在小程序展示完整的购物场景与购物体验逻辑。 ### 4. 添加新页面 1. 在 `pages `目录下创建对应的页面文件夹 2. 在 `app.json` 文件中的 ` "pages"` 数组中加上页面路径 3. [可选] 在 `project.config.json` 文件的 `"miniprogram-list"` 下添加页面配置 ## :hammer: 构建运行 1. `npm install` 2. 小程序开发工具中引入工程 3. 构建 npm ## :art: 代码风格控制 `eslint` `prettier` ## :iphone: 基础库版本 最低基础库版本`^2.6.5` ## :page_with_curl: 开源协议 遵循 [MIT 协议](https://github.com/Tencent/tdesign-miniprogram-starter-retail/LICENSE)。