# 简介
Magic-Shop是学习过七月大佬全栈课时所做的项目,是一个可以让商家直接接入的大型电商小程序,包含spu,sku,主题,优惠券系统等汇聚一体的电商,并且佩戴专业的测试或者cto可直接操作的cms后台管理系统。
# 相关截屏
# 功能汇总
TIP
此处只陈列的功能特性可能不完整，体验完整功能请前往C端
# C端
- 首页轮播入口
- 五个专题
- 活动
- 获取优惠券
- 优惠券定时归还
- 商品具有spu,sku
- 购物车与服务器同步
- 购物车核算
- 订单核算(核销消费券)
- 细节处理
- 支付逻辑
- 个人中心(订单 优惠券 消费记录等)
# CMS
- banner管理
- 主题管理
- 主题子商品列表管理
- 商品管理
- sku管理
- C端用户管理
- 分类管理
- 子分类管理
- 六宫格管理
- 活动管理
- 优惠券管理
- 订单管理
# 文档说明
此文档为总结项目开发坑和经验,为系列文章,我会不定期更新
主要分为六个板块:
TIP
sku处理- 封装请求,无感知刷新
Token - 优惠券结算
- 购物车
- 订单结算
- 细节处理
首先了解这些 vue 生态圈的东西，会对你上手本项目有很大的帮助。
Vue Router (opens new window) 是 vue 官方的路由。它能快速的帮助你构建一个单页面或者多页面的项目。
Vuex (opens new window) 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。它能解决你很多全局状态或者组件之间通信的问题。
Vue Loader (opens new window) 是为 vue 文件定制的一个 webpack 的 loader，它允许你以一种名为单文件组件 (SFCs)的格式撰写 Vue 组件。它能在开发过程中使用热重载来保持状态，为每个组件模拟出 scoped CSS 等等功能。不过大部分情况下你不需要对它直接进行配置，脚手架都帮你封装好了。
Vue Test Utils (opens new window) 是官方提供的一个单元测试工具。它能让你更方便的写单元测试。
Vue Dev-Tools (opens new window) Vue 在浏览器下的调试工具。写 vue 必备的一个浏览器插件，能大大的提高你调试的效率。
Vue CLI (opens new window) 是官方提供的一个 vue 项目脚手架，本项目也是基于它进行构建的。它帮你封装了大量的 webpack、babel 等其它配置，让你能花更少的精力在搭建环境上，从而能更专注于页面代码的编写。不过所有的脚手架都是针对大部分情况的，所以一些特殊的需求还是需要自己进行配置。建议先阅读一遍它的文档，对一些配置有一些基本的了解。
Vetur (opens new window) 是 VS Code 的插件. 如果你使用 VS Code 来写 vue 的话，这个插件是必不可少的。
SPU、SKU →