这个月，我领导了公司第一段小程序的开发。由于我之前没有相关的开发经验，所以绕了很多弯路，写了这篇文章来总结本月的开发过程。

在小程序正式开发之前，我花了两天时间阅读小程序的正式文档。阅读后，我的第一印象是：这不是Vue开发模型吗？所以我想知道是否有人会使用vue开发小程序。果然，有人写了一个框架wepy来使小程序的开发更接近vue，这主要是因为它对npm的支持，所以我决定使用wepy进行开发

创建一个小项目

在wepy中本地运行项目的步骤如下：

首先，gitLab接受代码，进入根目录npm install，然后npm run dev生成dist文件，并在开发人员工具中打开小程序项目调试，选择项目目录dist，可以看到实时调试效果

2.项目目录介绍：

image.png

如果您已经开发了vue，则此配置非常相似

3.项目启动的注意事项：

4.小程序如何测试：

5.我编写了小程序代码配置：

项目的公共配置位于app.wepy中，包括授权，验证，登录和用户信息获取

请求链接随项目环境切换。 公司为了解决后端域名每月只能更改一次的限制，创建了一个花生壳域名，并且不同的环境指向不同的域名，因此无需切换域名。环境。 小程序在后台更改域名太麻烦了

确切地说，6.坑是坑小程序

在项目执行过程中，我发现有一个详细页面，渲染速度出奇地慢，因为页面数据结构非常复杂，并且处理逻辑很多，所以我怀疑这是数据处理的性能问题，但是事实证明，这不是数据处理消耗的时间，但是wepy的脏数据检查非常耗时（apply（）），有时甚至超过20s，因此我放弃了wepy的apply（）并使用了setData（）作为小程序。问题还存在，原因是此页面数据量太大，并且转换为字符串的数据长度已超过100万。如果不慢的话，这很奇怪。 。 。 。解决此问题的方法只能是后端数据结构尽可能简单，级别尽可能少，数据量尽可能少...

有关详细信息，请参阅：这个大人物给出了详细的原因，作者说他正在2. 0

中对此方面进行优化。

相关文件：

小程序：

Wepy：

此外，我发现了一个小程序错误：输入组件已在该工具上正常调试，但是在手机上预览或体验版本时，将光标移到最前面并单击删除，例如。detail .value变为空。我和社区官员问，这显然是个虫子（手动狗头）...。错误链接：