快速生成vue模板_高质量页面分钟级快速构建解决方案

点击上方“蓝字”，发现更多精彩。 背景-业务痛点    

      目前公司有很多中后台PC端的业务，不同的团队负责不同的页面，这些页面UI粗糙、风格不一致，招致用户吐槽，难以体现平台技术的高度。中后台页面大概有几百个，很多都面临重构或者新页面的迭代，迭代效率面临挑战。在这种种问题与挑战的面前，我们发起了沉思行动，直面问题与挑战，克服困难，为未来技术的高质量高标准发展扫清障碍。

分析-我们遇到的问题和困境    

1、PC端页面风格不一

没有统一UI标准，不同的团队开发出来的页面不一样的，而且每个团队开发人员水平不一，开发出来的页面大部分也是比较粗糙的，但由于公司是提供平台服务，这方面用户体验就大打折扣了，对客户使用来说造成了一定的困扰。

如果已经有统一的UI设计稿，但是不同的开发人员对于相似的页面的都要自己开发一套，而且设计还原度也

2、组件化开发比较滞后

团队不同，没有相对统一的组件库，对于相同的功能不同的研发人员都要重复开发，造成比较严重的耗时，效率低下。

3、无法做到自动化快速构建迭代

当前的实现方式都是靠人工，靠每个研发人员从0到1去实现页面，没有自动化手段，效率低下，但是后台业务众多，效率提不上来，就会阻塞业务的快速发展。

如何解决  

统一UI标准

统一开发框架、组件库

开发可视化自动化页面构建方案

1、统一UI标准

对于页面风格，请UI同学出具了统一的设计稿，包括统一页面的整体色系，组件宽高、排列、间距，组件交互，以及页面一些共同的交互行为，这样基础的风格已经定下，后面主要着力于组件库的开发。

2、统一开发框架和组件库

历史原因，各个团队原来的开发框架是不一致的，总结下来主要有：

jquery + BootStrap

vue + Element

react + andDesign

layUI

为了减少不同的框架带来的开发成本，我们统一使用vue作为基础的开发框架，Element UI作为开发中的基础组件库。