一、原项目梳理
1、页面风格
1.设计多标准
项目经历了【程序员自主研发】→【集团UI设计】→【余月娇设计】三阶段，视觉标准不一样。以列表为例：
差异性：
2.公共业务模块
公共业务模块在多个主题下的风格不一致，以在【妇儿公众号】进入【预约挂号】中为例：
【粉色调】→【企业品牌色】
2、交互多标准
以【表单输入】为例：
3、前端框架、模板引擎两套技术栈
YLAPP单应用时使用Jquery为技术栈。
妇儿公众号、盆底康复使用Vue为技术栈，优化了数据双向绑定功能，详情如下：
4、第三方库、组件、插件
不同技术栈使用的第三库、组件、插件不一样，详情如下：
5、项目结构多标准
项目结构是针对代码组织结构，梳理了项目各重要的文件夹和文件夹对应的内容和作用。详情如下：
YLAPP：
目录名含义模糊不明确
├── statics // 静态资源文件，包含js、css、图片资源
│ ├── css // css
│ ├── fonts // 第三方字体图标
│ ├── js // javacsript公用类库
│ │ ├── AUXAPP //自定义工具类库，用于复用
│ │ ├── components //自定义业务插件类库
│ │ ├── core //包含基础类用到的所有底层插件类库
│ │ ├── module //业务javascript脚本
│ │ ├── plugins //第三方插件
妇儿公众号、盆底康复：
采用webpack后，实现组件化与模块挂开发后，优化了项目目录结构，便于团队协作。
├── build // webpack配置文件
├── config // 项目打包路径
├── dist // 上线项目文件，放在服务器即可正常访问
├── screenshots // 项目截图
├── src // 源码目录
│ ├── api // 数据交互统一调配，对接口进行统一管理
│ │ ├── user.js // 获取数据的统一调配文件
│ │ └── tempdata // 开发阶段的临时数据
│ ├── assets // 公共静态资源文件，非模块化资源
│ │ ├── css // css
│ │ ├── images // 图片
│ │ ├── less // less脚本
│ │ ├── scss // scss脚本
│ ├── components_modules //外部模块资源
│ ├── components //项目公共模块资源
│ │ ├── common // 公共组件
│ │ │ ├── alertTip.vue // 弹出框组件
│ │ │ ├── loading.vue // 页面初始化加载数据的动画组件
│ │ ├── footer
│ │ │ └── foot.vue // 底部公共组件
│ │ │ └── foot.img // 文件
│ │ └── header
│ │ └── head.vue // 头部公共组件
│ │ └── logo. img // 头部公共组件
│ ├── config // 基本配置
│ │ ├── env.js // 环境切换配置
│ ├── pages //页面资源
│ ├── views //项目模块资源
│ ├── plugins // 引用的插件
│ ├── router
│ │ └── router.js // 路由配置
│ ├── store // vuex的状态管理
│ │ ├── action.js // 配置actions
│ │ ├── getters.js // 配置getters
│ │ ├── index.js // 引用vuex，创建store
│ │ ├── modules // store模块
│ │ ├── mutation-types.js // 定义常量muations名
│ │ └── mutations.js // 配置mutations
├── favicon.ico // 图标
├── 项目名称
├── admin
├── mobile
