Vimo介绍

Vimo 是一个移动端混合框架的解决方案，包含了移动设备平台信息的初始化置、基础 H5 组件及 HyBrid 组件的注册安装、公共方法包装等。决定要写这个框架也是因为自己去年一年的工作需要做个总结，故以此为载体，将我对 H5 移动端的理解及认识总结在里面。

Vimo 是 VueMobile 的昵称，也是名字的由来，代表他是基于 Vue.js 为基础实现的。对于框架的开发，我自认为我对框架前瞻性思维和经验还是不足，借鉴与学习也许就是我现在最该着手去做的。因为开发过 IONIC 应用，认为 IONIC 在处理组件传参指纹、平台特性初始化等方面做得很好，所以就以此为蓝图进行模仿。因此，在阅读 Vimo 源码的时候应该能看到很多 IONIC 的身影。

我相信每个致力于技术方向的开发人员心里面都会有一个金字塔，金字塔的底部就是自己领域的知识积累，中间是经验与技巧，最上面应该就要实现自己的知识体系与框架思想。VImo 就是一个我的一个 Top，在开发完“杭州公交 H5”项目后，认识到这个过程是必须要走的。

也是为了在框架的基础上快开发，避免不必要的设计麻烦，节省时间多陪陪家人。

关于 Vimo 接下来的介绍，我将以问题的形式进行：

1. 什么是混合框架, 设计的目的是什么?

设计的目的：便于在各个系统(网页/平台/壳子)中都能步调一致的工作，将不同的部分抽离出页面，也便于调试！

问题搜集

什么是混合框架, 设计的目的是什么?

纯 H5 实现	纯 App 方案	HyBrid 方案	类 ReactNative 方案
效率高, 性能低	效率低, 性能高, 灵活性低	折中, 需要 bridge	特殊业务需要定制化开发插件

设计的目的：便于在各个系统(网页/平台/壳子)中都能步调一致的工作，将不同的部分抽离出页面，也便于调试！

现在的一种这种方案:

Vimo 设计思路来源于 IONIC, 为何选用 Vue 重构?
IONIC 的设计可以借鉴学习, 我对 vue 比较熟, 简单+快
IONIC Angular2.x + Typescript 陡峭+维护复杂
react 不熟, 但是从测试角度来看, vue 稍强
组件间嵌套规则是怎样的, 公共服务是如何注册到 this 上的? 为何要这样做?

App -> Nav -> | Page | -> Header/Content/Footer

覆盖大多数场景的布局结构

各个模块的作用介绍, 和简单的实现思路?

App: 主体 Nav: 路由切换的 wrap, 动画部分 Page: 业务页面

从我的角度来看你 Vimo 的不足和需要改进的地方
计划: IONIC 的皮肤+ vue 的核心, 展示 IOS/md/wp/wechat/ali/cus
只需要一个主题
IONIC 实现有些复杂, 有些代码没看懂
组件主要依据功能清单写的.
对 test 支持
hybrid 如何进行安装的由 hybrid 自己安装

改进的地方：

没实际的项目测试及运用，
关于样式的处理，计划简单点, 例如只支持 IOS 的
设计大多数是向类杭州公交【富 APP】方向靠，如果对单个页面的业务支持需要再改版.
列表组件及附属组件有些事不必要的. 需要剔除