微信小程序入门学习过程

最新推荐文章于 2024-01-29 23:11:34 发布

原创

最新推荐文章于 2024-01-29 23:11:34 发布 · 置顶 · 455 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#小程序 #入门 #学习 #问题

本文记录了作者学习微信小程序开发的过程，从注册账号、了解文档、下载开发工具到实际开发中的页面创建、WeUI使用、npm支持、问题解决等。遇到的问题包括API路径差异、scroll-view滚动问题、setData的误用等，通过官方社区和性能测试工具提升开发体验。

背景：想学习微信小程序开发，决定自己做一个小程序来熟悉大致过程

开发过程：

首先，需要注册登陆https://mp.weixin.qq.com/微信公众平台申请小程序账号（个人邮箱如果已经申请了公众号账号后不能使用同一邮箱再申请小程序账号）；
浏览开发文档https://developers.weixin.qq.com/miniprogram/dev/framework/，了解小程序的目录结构、基本配置项和框架使用方法。拥有Vue相关基础的话，基本无障碍学习小程序开发；
下载微信开发工具https://developers.weixin.qq.com/miniprogram/dev/devtools/devtools.html，完成下载安装后按照开发工具引导建立第一个小程序。这里笔者新建的是不涉及云开发的纯前端程序，语法使用JavaScript。新建完成后给出的小程序会包含一个的登陆页面及日志页面的示例项目，这个项目微信并没有更新，不包含一些新语法，但还是推荐仔细阅读一下用来学习小程序的全局配置，架构和语法信息。
之后熟悉一下微信开发工具的大致用法，工具可以实现小程序的API 和页面的开发调试、代码查看和编辑、小程序预览和发布等功能，而且可以直接关联了微信的git代码版本维护功能（工具确实不如主流编辑器好用，使用不习惯的同学可以在此处进行新建项目以及调试预览，代码编辑和版本维护的话可以使用自己常用的开发工具进行开发）。
终于开始正式开发了，新建一个页面，并在app.json里面加入tabBar信息（这个个人觉得小程序开发都会配置吧，但是示例里没有配置，可以