APP和小程序实战开发 | APICloud 3.0介绍和开发工具上手(一)原创

好，时间到了，我们现在准备开始了。各位小伙伴们大家好，欢迎来到API cloud3.0APP和小程序的实战开发系列培训课程。首先呢，介绍一下我自己，我是杨永安，我是比较早的就接触了API这个平台，然后呢，进行了大量的一些商业项目的开发，以及在项目的实践过程中呢，也积累了一些的开发经验，在此次直播的时候将会分享给大家。在开始之前呢，我们先看一下这个apl3.0的一个专题页。以及开发大赛的活动，也因为本次直播呢是为组建大赛所准备的，我们希望通过本次直播呢，给大家讲解API3.0的使用和组件的开发的一些技巧，并且呢让大家掌握API3.0的一些开发实战经验。

并且呢，在这个大赛中呢，也是准备了非常丰富的那个奖品。然后这是大赛的时间的一个安排，从3月8号开始报名提交作品，然后到4月16号就开始报名截止了，到5月18号活动结束就开始评审作品，评审之后呢，我们在6月1号将会进行公布名单，发放奖品。那大赛奖品就是刚才我提到的非常的丰富，希望大家能够积极参与进来，那我们现在开始我们本次直播课的一个主题吧，本次直播课呢，是一个系列直播课程啊，这是一个直播的大纲。嗯，一共分为五个部分，然后分五天的时间来讲解。第一天呢，就是咱们今天的这节课，介绍apl的3.0以及开发工具里面呢，包括API3.0的一个技术架构，以及和2.0的一些区别，通过一个多端项目来创建的一个过程，引导大家上手AR的3.0。

另外呢，就是开发工具的安装和基本使用。嗯，也推出了我们的新的编辑器，就是API663.0。这3.0呢，相对于2.0来说呢，做了很多的改进和优化，也是一个呃很好用的一个工具，然后我们通过这节课呢，重点为大家讲解工具的一个使用和一些调试技巧啊等一些基础操作，我们在明天的课程呢，会做一些基础开发的引擎模块特性的讲解。其中包括了一我们a3.0的特性。我们会以点餐项目作为例子，通过API和模块的使用呢，给大家复习一下2.0和3.0之间的一个区别，第三点呢，就是我们API的3.0是有自己的一个呃数据模型的，然后我们能能够通过avm的框架如何绑定数据样式和盗墓操作，来讲解我们3.0是如何去。

做出一个页面。那第四呢，就是我们可能会通过交互方面的一些知识呢，给大家讲解响应，或者说一些事件的一些处理，在第三天呢，我们就会进行一个组件开发的和跨端适配的一些讲解啊，因为我们3.0啊是组件化开发的嘛，现在很多的前端框架，或者是说像微友react都有一个开发思想，那么am呢，也是基于这个组件开发的一个模式下去做业务开发的，我们通过自己去定义组件开发，然后实现我们的业务复用，这样提高我们的开发效率和维护效率。然后我们会关注到一个案例本身的一些重点的，局部的，比如说可能有一些特殊的处理或者一些处理技巧，能够让我们的应用更加的呃完善，细节得到优化。

第三点呢，就是我们。会讲解到自定义组件以及组件的设计思路。如果有关心到a3.0的应用项目的小伙伴们呢，可能会注意到有一个act组件库，嗯，我给大家打开一下，这个项目呢，就是基于。Am做了一个组件库，因为很多小伙伴说啊，Am目前没有嗯组件库，没有UI库，所以呢，我们就参考了，就是目前比较流行的万能组件来设计了一个可以完成的实现，实现一些常用的组件，我们通过讲解这里面的一个设计思路，为大家提供这么一个设计框架，在什么时候该去收集，或者说什么时候该去封装关于自定义组件的啊这么一个思想。

同时呢，我们可能会最后大家用这个思路和逻辑之后呢，可能会为咱们这个这个组件库啊，偏专家的，就是咱们都可以参与到这个组件库的开发和维护当中。那么第四点呢，可能会有一些化妆适配和条件编译，因为咱们的英语老师将来可能会适配到小程序或者说APP以及H45多端的一个情况下，所以我们可能会做一些特殊处理，因为有了端它并不有一定特性。第四个板块呢，就是我们会讲到数据云与后端的交互，以及本地存储的一些。啊，这是。主要是就是分为两块，一块就是咱们数据云3.0的讲解，以及呢网络交互和本地存储，数据云3.0呢，是咱们去年推出的一个新的，嗯，Sola的一个后端服务，我们可以通过不不去单独的创建后端接口呢就实现了。

前后端一体化的开发，当然了数据云3.0也并不是必须的，就是咱们前端是使用A，后端呢也是可以使用自自己的一个后端接口，那么第五块呢，可能就是讲的是一些开发技巧优化和一些后期维护的工作。就比如说里面的一些最佳实践以及调试技巧，或者说一些不要避免就是。一些需要注意的点，然后咱们不要踩坑之类的啊，另外呢，就是咱们平台上面还提供了一些运维方面的工具，比如说云编译或者云修复这些功能。这就是整体的一个课程大纲，那咱们今天就从第一节开始。

API club其实就是一个低代码开发平台，我们之前呢是主要是以跨平台的开发技术，然后实现一套代码多端复用，在去年的时候我们推出了apl3.0的技术，使用a.GS多端框架来实现多端技术的一个多端应用开发。就是什么是跨平台。跨平台通俗来讲呢，就是一套代码多端复用。我们借助于一个发布会上面的一个PPT给大家。来描述一下。因为有很多厂商或者说一些团队在去实现这个跨平台的框架，那么说白了，其实跨平台呢，他一定是有这样一个需求，因为他能够为企业或者开发者来带来一些人效的提升，第三个呢，就是跨平台的开发工具已经趋于稳定了。就在开发前端开发的领域中呢，有Vs code的和web webpa等一些打破工具和开发工具，还有呢，就是一些前端的框架，现在主要的跨平台其实有两两种类型，第一种呢，就是呃，用web模拟UI的，像类似于l ni以及cordova。

呃，原生渲染的呢，就是最近比较火的，像以及Fla特或者这种解决方案。咱们apil其实是介于第一种和第二种之间的，因为在2.0的版本技术框架下，我们是使用HTML5去构建页面的和界用户界面，当然呢，也包含了一部分的UI模块。我这有一张图给大家看一下。左边的图就是基于自带的web view去实现的一个界面渲染，我们在开发过程中呢，使用标准的HTML加GS加CSS进行开发，那基于外部的一个好处呢，就是有强大的一个前端生态，开发者只需要掌握外部技术就可以做APP开发。

但是呃，Web view呢，我们知道有可能会因为一些厂商啊，或者说系统版本以及硬件配置的差异，存在各种各样的适配问题。同时呢外在操作系统的视图渲染结构中是属于比较重的一个视图，在内存消耗上面是不可控的。嗯，还有呢，就是例如像咱们开发过程中的ES6啊，这种语法不兼容的问题，以及呢，在部分手机上面，可能一些组件的表现形式也不一致。那右边的呢，就是咱们的A价格的3.0的一个新的渲染模式。可以看到呢，就是API和3.0已经不依赖于外部V，而是采用V8引擎结合的a.GS作为底层渲染引擎。

除了开放API之外呢，还提供一些视图模型及组件化的方式提供给开发者调用。新的引擎呢，就是完全可控的，比外部呢更轻，然后使用的是100%的原声渲染，前面的是一些基础知识和概念，听起来可能比较枯燥一点，那么现在我们开始直接进入。啊，开发工具的安装和使用，在官网可以下载到开发工具。这是咱们API3.0的一个官方文档概念里面呢，就会有API3.0的一个说明。点击这里呢，就会进入工具的一个下载页面，我们可以根据我们自己的操作系统下载合适的版本，然后安装的时候过程其实也不并不复杂，也就是简单的下一步就可以了，安装好了之后呢，就大概是这个样子。

我拿到工具的一个文档来给大家讲解一下这个工具的使用。并且呢，可能会，呃，演示一下咱们要用到的那个案例。首先我们看到整体的一个界面，这个图啊，可能跟那个工具已经是同步的了，这已经是最新的一个截图。左边呢是一个工具栏，分别是资源管理器，这里是搜索工具栏，这里是咱们的一个get的管理。呃，下面呢，是一个拓展包的一个界面，因为咱们一三点零已经更新到最新的版本，就是和VVI4的已经保持更新了，所以啊，这里的拓展呢，其实也都是可以使用的。下面呢，就是实时预览以及升级同步，还有云编译。

这三个常用的一些按钮。我们通过创建一个项目来给大家演示一下具体的操作。打开之后呢，我们通过点击项目新建项目。在这个界面呢，我们会看到一些，呃，有一个表单页面，需要我们完成这个项目的基本信息，我们在这里可以输入我们的应用名称，比如说今天我们的嗯项目是一个点餐项目，我们就给它输入一个点餐的名称。嗯。这里可以输入一些应用说明，下面可以选择应用类型。关于这个应用类型呢，我们还是需要为大家讲解一下。在这里呢，就是我们能看到那个文档的主页上面，就是给大家介绍了这个应用类型。

因为API到3.0推出之后，我们是嗯，就从跨平台技术就全面升级为多端技术了，在这里呢，我们也保留了2.0所有的技术，这和开发体验，所以很多小伙伴们对这个应用类型可能也比较模糊，或者说比较，嗯，不不太清楚，我们给大家介绍一下。首先呢，这个应用类型包括四种类型，第一种就是native APP，什么是native APP呢？指译过来就是原生APP，我们如果只考虑在安卓和iOS上面运行的话，我们就可以选择，嗯，Native APP专门为这个的这个平台呢做了很多的优化和适配。不需要考虑跨平台的一些兼容问题呢，我们有的地方可以使用一些类似的这样原生组件来提提高咱应用的一个性能，在原生端有一些自己优化的一些地方，嗯，比较适用于原生端的一些特性。

第二个呢，就是MXP，就是我们经常提到的多端应用，这也是apl3.0主要的一个应用类型，使用am一次性开发呢，就可以同时生成小程序，安卓iOS APP以及呢就是H5端的外部APP的应用，多端应用呢，就是适用于小程序优先的场景。如果你的业务中呢有小程序的需求，那么就可以使用MXP的模式完成小程序的代码开发呢？那么我们就可以同时还能生成一个APP，就是生成native端native加H5加。小程序就等于咱们的MXAPP。第三种呢，就是APP clip，这个呢是iOS词试新推出的一个苹果小程序。它的开发模式呢，其实也是。

嗯，和咱们的2.0和3.0都是一样的，因为是使用了A的引擎的话，那么也可以使用2.0，也可以使用3.0，只不过就是说呢，咱们可以支持这种类型，然后关联到咱们的主应用，就可以一同上架到苹果商店。第四个就是我刚才提到的外部APP，把已有的H5网站可以打包成外部APP这种类型，我们的am3.0呢，也是可以编译和转化成H5的应用的。因为我们想啊，就是如果说要跨平台的话，我们肯定不能像以前那样啊去。自由的组织咱们的那个代码，然后完成业务开发，这样堆砌出来的呢，我们没办法去分析他到底是写了一个什么样的业务，也没办法去抽离和重新翻译成其他的平台的一个语言，所以我们需要自己自己定义一套啊，自己的语言规范，然后通过结构化的数据去给他分析一些相对应的逻辑，或者说UI层啊，以及样式层啊。

和事件处理数据绑定的，这样的话我们可以通过一个抽象的嗯语法来解析出。咱们需要的一个界面的描述语言，通过界面的描述语言呢，它可能会会是一个虚拟盗这样的一个东西，然后转化到咱们对应的平台，比如说如果咱们要编译到APP呢，就通过。Native端拿到咱们的这个描述语言，然后通过平台所对应的一些。接口去创建，最终所呈现出的一个界面效果，那么小程序和H5呢也是一样，好，我们还是回到我们的工具里面，刚才只是为大家介绍了一下应用类型，现在大家对这个应用类型就是说你如何选择应该没有疑问，就现在如果说啊，打开这个界面的时候，我们可以我们要自己选择什么样的类型，嗯，应该也没有什么疑惑了，或者说针对自己的业务场景，然后可以做出选择，这个项目呢，可能会支持多端，然后我们就选择这么一个MXP，因为我们可能以后会为大家演示在小程序里面去运行的效果。

再下面呢，就是一个选择模板。在咱们工具里面内置了很多的的一个模板，就是为了让大家学习嗯A是如何使用的，所以我们把这些模板最开始做出来的模板都放在工具里面了。我们可以点击这个唐诗点餐模板，因为我们接下来的课程呢，将会基于这个模板去作为讲解，设置好了名称说明以及类型，还有模板之后呢，就可以点击完成。点击完成的时候呢，它会弹出一个对话框，让你选择你项目的保存的路径。

嗯，这里我们新建一个吧。我们选择一个位置呢，它会云端检出咱们的项目代码。另外呢，在咱们的控制面板其实也是一样的。我们找到一个。网页上的控制面板。大家可以在这里可以看到一个创建英维按钮，有一个同学问MLAPP已经包含了开发APP，为什么还需要APP？啊是这样的，就是有一部分的业务场景，比如说有些公司他可能只只想做APP对吧，那么可能只只会做安卓还iOS，没有考虑到小程序，或者小程序已经使用其他的一些模板呀，或框架已经做出来了，只开发native APP的时候呢，就选择这个native APP啊，因为我刚才提到了native APP里面呢，可能有很多的一些特性，比如说list view啊，或者说一些组件框架，能够提升咱们的应用效果，而且呢，其实从产品逻辑上来说啊，小程序和APP其实是不同两个场景。

嗯，因为很多东很多的业务场景呢，就是小程序只是一个推流，或者是说把核心业务做为小程序里面那么完整的，或者是说更加核心的功能呢，可能还是放在APP端上面来实现的，所以这就是为什么会有MXAPP或是native APP这样两个选项了。现在你对这个问题应该没有疑问了吧？还是看到网页上面跟我们的工具里面其实是一样的，有四种选项，四种类型呢，我们还是刚才讲到那个啊，我们就不多过过多介绍了。啊，但是咱们的网页上面呢，模板可能比较少。我们可以通过点击更多的选项呢，进入到咱们的模板页面，在这里呢，就是大家可以看到我们都是使用am3.0开发的一些应用的模板，可以通过下载他们的源码，放到自己的工具里面去跑一跑，看一看，然后运行一下。

很多需要学习的点啊，可能就是在项目中啊就能体现出来，另外呢，就是我们还有要跟他。上面有一个看一下是MXDP。这个项目呢，就是。咱们的一个多端应用的集集合仓库，这个仓库呢，就是咱们的一些嗯，常见的项目，然后也会做一些及时的更新。所以推荐大家把这个项目点一个SPA。然后回到工具里面，我们刚才是创建了一个项目，他已经显出成功了。网页端的创建应用也是一样的，然后创建完成之后呢，它不会检出代码啊，这个选择就是刚才提到的这个。

关山。有小伙伴已经提到这个问题了，我讲就讲到这里啊，选择这个和不选择这个其实没有什么太大差别，可以后期就是说你可以通过混合的这样一个模式来创建你的应用。还有人说。2.0使a.G1S就会转移成ES5嘛，这个是不会的，因为咱们用的a.GS它才会走那个编译的过程，如果是2.0的话，就不会去走编译，因为编译其实还是很消耗性能，不是说很能浪费时间了嘛。嗯，二零的话，嗯，就是你可以使用一些第三方工具，或者说自己做一些构建工具的一些，然后去将你的ES6转移成ES5。点击创建之后呢，这个项目就创建成功了，我们在这里左边就能看到咱们的一个项目。就是刚才我们的工具人创建的，如果说在网页上创建也是一样的。

嗯，我们在这里呢，就是可以给他设置端设置呢，可以设置一些基本信息，然后下面是证书，如果是你需要，嗯，开发测试的话，就是证书是需要先设置好的，下面代码呢，就是我们可以在这里看到我们提交代码的一个记录。啊，这里我们刚刚创建了之后呢，系统往里面卡了一次，我们的模板代码，在这里面可以看到我们咱们的那个点餐的项目编码都在里头。然后模块呢，或者云编译这些，咱们后面再为大家讲解的时候再看，我们还是回到咱们的工具里面。嗯，因为这个编辑器可能大家其实已经使用的很熟悉了啊，但是为了照顾到一些新来的小伙伴，还是给大家统一的过一下好吧。API和studio63.0和2.0的区别还是挺大的，因为咱们的2.0是使用atom编辑器，3.0呢就是基于VQ的了，咱们做前端的其实可能很多在使用VSQ的，所以体验习惯上面还是比较接近的。

而且呢，3.0的话，就是它会针对咱们的am去做一些编译，或者说一些呃预览啊，或者是这些功能。我们先在这个主页，然后点击一下这个实时预览，预览框呢，就能看到这个页面出来了，之前的工具呢，好像是在排版上面是有一些问题，因为那个使用的那个web view，它的那个版本是比较低的，在升级了3.1之后呢，就是针对这些做了一个全新的更新，所以在这里呢，就是。已经能够最大程度的还原和接近咱们的最终的效果了。这里使用一个模拟器吧，给大家跑一下这个项目。啊，跑项目之前啊，我看了一下，应该是还需要打一个的工具呢啊，我们有一块可能落了没讲，就是登录。

登录的话，因为就是我这个是已经登录好的了。所以呢，它是有账户信息在里头的，如果你是第一次安装的话，那可能就。需要登录一下，登录的话就是咱们的，呃，这样一个界面，就跟咱们官网登录其实是一样的。创建项目，就是刚才咱们已经提到的，除了新建项目之外，还有导入项目。我们可以通过本地导入或者云端检出的方式呢，就是把别人的项目导入到咱们的工具里面，或者说咱们通过呃，Get up下载的那个U的一个项目，下载成那个本地源码，然后可以通过本地导入，以及呢，就是说你可能在网页上创建的项目，咱们就从云端检出，它会关联到你账户上面的SNN的一个仓库去。找到你的项目，可以给他检出出来，其实跟创建项目，其实后面的步骤是都是差不多的。

嗯，另外呢，就是因为针对咱们am3.0呢，它有些内置的一些模板文件，比如说在项目的根目录上面去右建，新建的时候呢，它可以创建这些以前二点零一些常用的一些文件。在配目录上面新建了，就可以创建STMLJSCSS文件。在is目录上面来新建，就可以创建这些加密文件，或者是说一些应用摘要信息。我们在这里呢，就是可以通过比如说配置目录这里有个新建，不是这里的新建啊，是下面这个新建，新建的展开菜单里面可以去，因为它可能需要获取上下文，然后识别到你是什么样的一个类型的目录，然后在目录下面呢，可以给你提供一些模板。比如说我们在这里创建一个HTML文件。去做一个演示的，它这里就是类似的一些，嗯，模板，咱们就可以快速的完成咱们的页面，然后先删掉啊。

这个模拟器起开之后，我们看一下这个运行的效果。在运行之前呢，我们先编译一个自定义load。在这里这个界面可能比较小，我们还是拿到那个控制台来看一下。在模块里面会有一个自定义load选项，因为现在咱们还是新建的应用，没有自定义load，最好是编译一下，我推荐大家呢是使用自定义load来调试咱们项目。嗯，本身呢，API cloud的官方呢，也提供了一个APP load是一个比较大的一个load，它里面是包含了所有的一些东西，但是呢，它并不能完全的贴合，就是咱们最后的开发效果，我们这里有一个。

自定义多的说明。自定义load呢？就是每一个APP都会创建一个自定义load。这个logo呢，就是使用你的包名，然后你的图片啊，你的图标，你的启动图片等等，还有一些你本身是内置在APP里面的一些信息，如果说你有一些第三方的信息，比如说百度地图，或者是微信登录这些K啊，可以保存在这里面，然后通过这个自定义漏洞呢，它会打包在里头，签名啊什么的，就是与最终的生成的那个安装包是非常接近的。然后自定义都还有一些特性，比如说你可能会处理到一些状态栏，或者说从第三方应用跳转进来的一些情况，咱们使用自定的呢，就是能够更好的还原最终的一个效果。这里已经编译好了，我们下载一下。

这就是刚才我们打包的自定义load。可以看到打开自定的之后呢，它是一个空壳，就是刚才我提到的，嗯，它把咱们的一些自定义模块啊，或者说一些加密文件，它是放在里头的，所以咱们真正的同步，或者是说。变化的东西其实就是在这里面的，呃，一些业务界面，或者说业务逻辑，而真正的打包呢，关于原生或底层框架方面的东西呢，就是放在这个logo里面的，它是两部分的。我这里同步一下，我们看这里连接信息，如果你是真机的话，就可以直接扫一扫了，我这边不是太方便，所以我就直接输入一下。连接好之后呢，你会看到这个绿色小球已经变绿了，它就是已经连接上了。

我们打开一个项目里面的页面，然后选择同步，然后他已经获取到了，就小米的手机，就是咱们这个模拟器，那模拟器其实是就是那个小米手机。这个就是云同步的按钮。咱们点击这个。设备它就开始编译，因为咱们那个3.0的语法是不能直接运行的，它需要编译成一个GS语言，然后再同步到设备上面。这里就能看到这个效项目的效果了，如果说你们通过在官网创建项目，或者是说在get up上面拿取项目的话，它就是也是这么一个操作流程，也可以通过导入项目或者说新建项目，然后自己去运行一下这些DEMO。这个项目呢，看起来非常简单，但是呢也是非常典型的，就是一个唐诗点餐的一个应用。

主页呢，就是一些商品的列表，然后有价格。点进去呢，还有上面的详情还有一些。哎，怎么出来两个小球啊，这个情况我也我也是第一次见到啊。然后可以加入购物车。然后在菜单页呢，有一个嗯，左右两难的布局，很多外卖都是这样的一个结构啊，就是。左边是分类，右边是分类下面的详情，然后点击左面的分类的话，它可能会有一个同步的两个滚动的状态。嗯，这个页面呢，就是刚才咱们加购的一个购物车的一个页面。可以在这里做一些修改或者编辑这样的一个操作。啊，上面呢是价格数量，下面呢就是会计算出它的一些价格属性。然后可以点进去结算，然后就是一个待付款的订单页面，在这里可以还是可以输入一些备注。

嗯，然后可以点击支付。啊，这个地方它报错了。因为没有登录。那么这里还可以在用户界面去点击登录，在开始做那个项目的时候，它是有那个真实的微信登录的，但是每一个项目呢，可能没有一个统一的那个K吧，所以我们这里做了一个模拟登录。现在他就是给你做了一个模拟登录的话，那么账号就已经有了，那么大致这样一个项目，嗯，我们通过这几节课呢，我们希望大家也能自己能写出这么一个应用，这个空白的昵称小伙伴他又问他说am可以兼容小程序组件里面使用slot吗？是这样的，就是小程序里面的slo和这个view里面的slot，以及这个前端个slot其实都是不太一样的，它有自己的一个解习规则，所以就是咱们现在目前的话，Am点击S里面暂时还没有官方的lo这样出来，嗯，后面呢，可能会完善咱们这个能力吧，就是可能会支持这个slot，以及并且呢，考虑到如何去在APP端或者说H5端以及小程序端做一个很好的协调，去实现这么一个lo。

提到slot的话，就官方引擎是现在目前还没有实现，但是这个act这个组件库呢，简单的实现了一下lo查的功能，给大家看一下吧。就比如说这个商品卡片这这么一个组件，它源码里面其实是涉及到lo的。在这里呢，我们是使用一个下划线的一个标记属性，然后定义了一个lo啊，在模板里面呢，在那个组件里面，我们可能会通过嗯，也是同样的一个属性，然后去解析到做什么插槽与功能。

张小刚同学说getupb中有含扫描二维码上传图片的案例吗？是这样的，就是扫描二维码和上传图片的案例的话。嗯，目前是没有，但是我可以给你一些思路，扫描二维码的话，你可以使用2.0的方式，就是直接使用模块，因为这么后咱们后期会讲到这个模块的使用，因为扫码这个还是跟底层或者原生交互比较密切的一个东西啊。嗯，上传图片的话，其实上图片这个没有什么，和2.0和3.0应该没有区别，因为它就是一个HTTP的一个请求方面的一个东西，所以啊，关于上传的话就是。

好好看看一下咱们的API对象里面的这个请求。上传的话，你需要的上传内容是在这里的。因为咱们am3.0其实也是使用的，嗯，咱们的API的端的一些API。这里就是可以通过你跟后端去定义一些数据规则，然后你们要传二进制，还是一些用装贝的方式啊去怎么传，这个要看你们自己去定义，当然后面的话有需要我们可能会做一些这样的案例。在这一块是我们的3.0的开发，但是3.0和2.0是它们是并不是完全割裂的，就是我们在3.0开发的时候，也是要频繁的使用到2.0的端API的一些属性或者是说方法，所以我们在开发过程中如果遇到问题，先看3.0的文档，然后需要使用到一些二点基础的一些能力和方法，能够在这个文档上面找到，我们在开发的过程中呢，我们最好是能够过一遍有哪些。

嗯，特性或者是哪些方法在开发过程中呢，就是能够知道在哪里去找。啊，刚才我们讲到了一些登录创建导入或者创建模板文件。嗯，这样的一些功能，另外呢，我们其实刚才在演示过程中呢，也给大家演示了WiFi同步，或者是说自定义啊这样一些功能。嗯，另外呢，就是大家比较关心的就是。如何去代码提交？更新代码，像这些功能，因为我们在做开发的过程中呢，是频繁的去两个仓库里面去提交他记录的页面，比如说我们现在是在首页。首页呢，我们可能做了一些更改。上面的那个赵超同学说必须要会为嘛，其实并不是必须要会为啊，但是咱们的框架其实是比较。

嗯，接近的还有react的，如果你有react或者VI的那个基础知识呢，是当然是非常好的，如果没有的话，其实也没关系，因为那个其实非常简单的，咱们打开那个文档看一下的话就是。有一个立即体验，当然把这个页面给大家忘掉了。在这个页面呢，就是它是一个。内未有的，所以它并不是完全未有的，它是一个精简版，就是可以理解为精简版的。呃，因为view呢，里面可能会包含一些像root啊，或者是说咱们这个组件里面并不是太特别需要的一些东西，咱们做了一个类似于这样的东西，就是为了让大家。让VI的用户的用户比较好上手。如果说咱们只会HMLGS和CSS的话，就是我觉得就加以学习。

呃，也没有多久时间就可以完全上手掌握，因为这个毕竟也不是特别的复杂。对，就是和和小程序是非常类似的。嗯，我们还是继续回到这个工具里面，因为时间可能也差不多了，我们要把剩下的东西要讲完，就是我们这里能看到这里有个营业中这样一个字段，我们看到这应该是。在这里对应的源码。我们这里写一个，打烊了。然后做一些修改，在这里呢，就会看到咱们的一些代码的变更，然后。可以做一下代码提交。然后它会出现一个呃，Commit的一个界面，就是如你可以在这里写上你的一些提交信息啊，你做什么修改，或者说有什么变动，你可以在这里做一下。

嗯，这里我就还是写一个测试提交。这里呢，他就会把咱们代码提交到SN的仓库里面，可以看到这里。版本已经变成了。第二版。然后回到咱们的项目里面的代码里面。其实也能够看到这里有提交记录，也是版本号是V2。啊，还有一个最重要的功能，就是在微信开发者中预览。我们点击这个项目根目录，然后有一个编译为微信小程序。此时呢，它就会在项目下面创建一个目录，叫做auto MP，这个目录呢，就是咱们最终会编译成小程序的代码源代码。呃，如果你有开发者工具的话，你可以直接打开这个项目，当然也可以直接在编译完成之后呢，选择这个项目，直接点选在微信开发者工具中预览。

啊，这里它会弹出一个框啊，就是它会让你输入APPID，因为我们知道微信小程序的话，我会关联到你的一些微信开发的一些权限。然后他会为咱们打开小程序工具啊，我们看到小程序工具已经打开了。工具里面呢，其实和咱们的那个模拟器也是很相似的，这些功能都是。完全都适配了。已经。还有购物车的结算，其实这个都是一样的。另外呢，我们这里也可以使用一些调试去打印咱们日志，这个是小程序工具的一些使用。工具预览我们刚才已经给大家演示过了，还有就是增量编译和一个全量编译，因为有时候我们的代码可能并不是需要全量编译，只是需要增量编译某一个页面。

然后这个就是咱们的工具，其实好像有很多的小伙伴们还在使用2.0的工具啊，就是但是我推荐大家还是使用3.0。