概述

美味心语小程序开发实战概述

对于小程序的开发,我们遇到了什么问题?想要如何改善?如何利用已有的开发资源?如何重复利用开发好的组件?如何使用我们熟悉的开发技能来开发小程序?

2018-06-19侠课岛    初级拔高       

前端/移动端/小程序全栈开发实战-美味心语小程序开发 24     0     2585

我们在前面讲解了基于微信开发者工具的小程序的基础知识,然后也用一个虚拟数据的流夏旅行网的实例实现了一个基于微信开发者工具的原始的小程序的开发模式,通过这些开发,我们碰到了一些问题,也有有一些自己的思考:

基于原始的小程序开发有如下优点:

  1. 入门快,会JS+HTML+CSS的前端开发人员就可以很快的入门;

  2. 组件、API等使用门槛低,按照文档基本都能够使用起来;

  3. 无需过多的其他前端的配置、安装

缺点也很明显:

  1. 比起webstorm/vscode/atom等这些编辑器来,小程序的开发者工具功能显得太简单了,编码体验很不爽,真是谁用谁知道;

  2. 原始开发的一个小程序路由一般有4个文件构成,项目稍微大一点,我们维护起来文件系统经常容易混乱;

  3. 无法使用Less/SASS/Postcss等css预编译语言,无法使用组件化开发,我们如果有熟悉的Vue+LESS/SASS等的开发技能,无法施展啊!npm安装的文件我们还需要手工复制!

我们想要这样的小程序开发

  • 我们首先想改变的就是不想用小程序的开发者工具来开发,而使用我们熟悉的Webstorm来开发,我们不打算自己造轮子,于是我们研究了来自蘑菇街的min框架(https://meili.github.io/min/index.html)、已经被腾讯“收编”的wepy框架(https://github.com/Tencent/wepy )、来自美团的mpvue框架(http://mpvue.com/  )等,这几个都能够满足了我自己不造轮子的需求,直接可以使用Webstorm来开发,然后自动编译为小程序需要的文件,然后小程序开发者工具自动刷新预览,甚是方便;

  • 从我个人使用,min框架相比wepy和mpvue要简单一些,不一定需要掌握vue的开发技能,其实大部分微信小程序的组件/API都可以直接在里面使用,对于没有vue开发经验的同学,很容易上手使用;

  • wepy和mpvue都需要vue的开发技能,如果掌握了vue的开发,那么你就很轻松的驽驾这两个框架,并且这两个框架也有很多现成的插件可用,开发用户量也挺多;

  • 除了这些框架,我们还发现了京东的基于React的Taro(https://taro.aotu.io/  )小程序框架,看起来也不错,如果可以,我们也可以试试。(大公司就是有钱任性哦,动不动就造个轮子玩一下!不过我蛮喜欢他们这样开源惠及我等屌丝码农

  • 另外,在原始的小程序开发中我们想改变一下css的编写体验,比如要引入LESS,min/mpvue/wepy都是支持的!然后也想除了微信自带的简单的UI组件,还想引入一些已有的UI框架,加速我们的UI开发:过研究发现,min自带组件,组件体验还不错(https://meili.github.io/min/docs/minui/index.html  );有赞也出了一套UI组件(https://github.com/youzan/zanui-weapp  ),最近iview也出了一套(https://weapp.iviewui.com  ),这些UI组件都可以很方便的引入到我们的开发中去,当然你也可以自己写代码去实现。

我们将会在这套小程序实战教程中,通过实践来选择一个适合我们自己想要的小程序框架,实现我们想要的Webstorm开发,组件化的开发能力,方便清晰的文件管理,易于升级维护的开发体验。

本教程图文或视频等内容版权归侠课岛所有,任何机构、媒体、网站或个人未经本网协议授权不得转载、转贴或以其他方式复制发布或发表。

评价

24

本课评分:
  •     非常好
难易程度:
  •     适中的

内容目录


本文索引


|
教程
粉丝
主页

签到有礼

已签到2天,连续签到7天即可领取7天全站VIP

  • 1
    +2 金币
  • 2
    +3 金币
  • 3
    +5 金币
  • 6
    +7 金币
  • 5
    +6 金币
  • 4
    暖心福利
    自选分类VIP ×1天
  • 7
    惊喜大礼

    自选分类VIP ×3天 +20金币
  • 持续签到 +8 金币

金币可以用来做什么?