如何开发微信小程序?开发环境篇

前言

  鄙人的文章都会跟随着时代的递进而更新!大家如果想要得到最契合当下时代的文字,可以关注以下鄙人。

  本篇文章发布时间:2020年5月18日。

  本篇文章最近更新时间:2020年5月18日。

  近期鄙人正在参加2020中国高校计算机大赛举办的的微信小程序应用开发赛,召集了四个人从0开始学习微信小程序的技术分析和开发,从0开始搭建开发环境和第一次尝试团队合作开发。

微信小程序应用开发赛
  各位看到本篇文章,基本可以不用打开以下我引用的文章了,因为这些文章大都已经失去了其时效性,如今已经失去了大部分价值,甚至会引导大家走入误区!在此强烈谴责那些如今仍在搬运(且说是搬运,我甚至已经找不到原文是哪位先生写的了!)这些文章的人,你们不仅是在可耻地盗窃,而且在不负责地误人子弟!

  本人在网上寻找了许多文章,比如《五大微信小程序开发IDE深度评测》《7个最热门的微信小程序 UI 组件库》《几款微信小程序快速开发框架》等等,参考了各大框架,分析出了一套最适合于当下的微信小程序开发的前期准备推荐清单。

开发环境搭建

  首先是IDE,引用文章测评的五大开发IDE为微信开发者工具Egret WingSublime TextWebStormvim+WEPT,当然还有一款是如今许多微信小程序教程里面推荐的VSCode+插件,在此我都会重新评价一下这些IDE。

微信开发者工具

优点:
  • 依旧是如今最合适的微信开发模拟器
  • 官方工具,可调式、可预览
  • 官方更新迅速(这也造成了其他IDE的没落)
  • 支持2019年推出的云开发,开发效率一跃千里
  • 部分VS Code插件已经支持(鄙人没用过,不做过多评价)
缺点:
  • 代码提示依旧不全,写代码效率依旧困难
  • BUG过多
  • 代码风格规范困难
总结:

  微信开发者工具依旧是一个非常好的微信开发模拟器,而且微信推出的云开发能够大幅度提高开发效率,因此微信开发者工具必不可少,甚至使得其他IDE选项都不再耀眼。

微信开发者工具

Egret Wing

总结:

  2018年8月之后已经停止更新了!请不要再误人子弟了!

Egret Wing

Sublime Text

总结:

  2016年11月之后已经停止更新了!请不要再误人子弟了!

Sublime Text

WebStorm

优点:
  • WebStorm插件库里的微信小程序开发插件仍在更新,支持程度强。
  • WebStorm的开发环境和风格优秀。
  • WebStorm支持各种快捷键和Vim。
  • 可以同时支持小程序编程和大前端编程。
缺点:
  • 无法进行调试预览
  • 部分云开发相关的代码提示不足
总结:

  我个人认为这是目前微信小程序开发支持最好的IDE,或者可以称为编辑器(因为没有预览和调试功能),但可以配合微信开发者工具进行开发。同时JetBrains对学生十分友好!可以使用学信网信息进行学生认证,获得免费使用专业开发版的资格。原评测的功能多和臃肿问题,我认为目前的开发者电脑足以支撑其庞大的IDE开发体系,并且许多功能都能给开发者更多的便利。

WebStorm
插件

vim+WEPT

总结:

  WEPT已经不再维护!WEPT作者建议使用微信开发者工具!请不要再误人子弟了!

WEPT

VSCode+插件

优点:
  • 优秀的编辑器(鄙人使用频率少,不做过多评价)
  • 庞大的插件库
缺点:
  • 网上推荐的微信开发插件更新中断,无法跟上微信开发文档的更新。
总结:

  鄙人从网上推荐的插件得不到和WebStorm一样的开发效率,甚至插件已经停止更新数月,不再支持如今的小程序云开发,因此鄙人不推荐。如果有人有更好的插件推荐,可以留言回复,谢谢大家!我相信VSCode这款编辑器是非常优秀的!

minapp

最终总结:

  最终在下选择了WebStorm作为IDE和主要代码开发工具,同时可以作为Vue和Node的大前端的后台开发,并且使用微信开发者工具完成微信小程序的调试和模拟。

  由以上的分析可知,WebStorm + 微信开发者工具 + 云开发 必定是以后微信开发的主要方式,甚至一名大前端开发者可以完全在数周之内实现一个优秀小程序前后端的开发和快速上线!

  开发布局如下(多显示器效果更佳):

开发布局

环境/工具描述代码高亮代码提示调试实时预览云开发软件/插件
官方工具微信开发者工具支持极其弱支持支持支持下载软件
Egret Wing首款支持微信小程序开发的IDE(停止支持)停止支持停止支持停止支持停止支持停止支持停止支持
Sublime Text 3Sublime Text需要安装插件(停止支持)停止支持停止支持停止支持停止支持停止支持停止支持
WebStormWebStorm重量级IDE支持支持不支持不支持部分支持下载/插件
vim+WEPT强大的组合工具(停止支持)停止支持停止支持停止支持停止支持停止支持停止支持
VSCode+插件强大的编辑器(停止支持)停止支持停止支持停止支持停止支持停止支持停止支持
开发微信小程序的步骤如下: 1. 注册微信小程序账号:首先,你需要在微信公众平台注册一个小程序账号。请确保你已经注册了微信公众号,并且注意微信公众号和小程序是两个不同的账号,拥有不同的appid。 2. 创建小程序:登录微信公众平台,进入小程序管理后台,点击"创建小程序"按钮,填写小程序的基本信息,包括小程序名称、appid、小程序类型等。 3. 开发小程序微信小程序开发主要使用微信开发者工具进行开发。你可以在微信公众平台下载并安装微信开发者工具。使用微信开发者工具,你可以创建小程序项目,编辑小程序的前端代码和样式,以及调试和预览小程序。 4. 编写小程序代码:在微信开发者工具中,你可以使用类似HTML、CSS和JavaScript的语法来编写小程序的前端代码。你可以使用微信小程序提供的组件和API来实现小程序的各种功能,例如页面布局、用户交互、网络请求等。 5. 预览和调试小程序:在微信开发者工具中,你可以实时预览和调试小程序的效果。你可以在开发者工具中模拟不同的设备和网络环境,以便测试小程序在不同设备上的兼容性和性能。 6. 提交审核和发布小程序:当你完成了小程序开发和调试后,你可以将小程序提交审核。审核通过后,你可以将小程序发布到微信小程序平台,供用户使用。 请注意,以上是一个简要的开发微信小程序的步骤。具体的开发流程和细节,请参考微信小程序开发文档,文档链接为:[微信小程序开发文档](https://mp.weixin.qq.com/debug/wxadoc/dev/index.html)。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值