AppCan尖课笔记（二）丨IDE开发流程详解

相信AppCan的小伙伴们对IDE一定都不陌生。在APP开发中，IDE能够帮助开发人员完成开发、调试、跟踪、模拟，并借助内嵌的打包功能，生成可直接安装到手机的本地应用安装包。然而，在使用IDE时，或多或少都会遇到一些疑惑。本文将向大家普及一下如何正确的更好的使用IDE。

1、注册AppCan账号，下载并安装IDE

首先，进入appcan.cn官网，注册账号并成为认证开发者。

然后在“文档中心”-“开发工具IDE”-“AppCanIDE安装下载”处下载IDE，并安装。

2、创建应用

在appcan.cn的开发者中心创建应用，请选择“hybrid”模式。

3、登陆IDE

应用创建完成，启动IDE，使用AppCan账号登陆。

4、同步项目

创建AppCan项目，选择同步项目。

显示应用列表，选择要同步的应用，点击“完成”，应用即可导入成功。

注：如遇到代码检出失败，请先确认登陆账号是否正确、网络服务是否通畅，可使用客户端本地同步验证是否能成功，如有问题，可联系线上客服。

5、编码

根据项目需求，对导入下来的应用进行编码开发。

IDE内集成了UI框架、JSSDK、引擎、插件及海量的应用模板，供大家使用。

相关开发问题请参考文档或论坛发帖。

6、预览调试

开发阶段中，IDE提供了“实时预览”功能。选中要预览的页面，点击 ，即可边改边看。

在“实时预览”区域中，右键支持“刷新”和“调试”。

大家也可使用模拟器进行预览调试。

选择index.html右键，点击“预览”，

启动模拟器，支持分辨率、横竖屏切换及调试预览。

7、本地打包，真机调试

在IDE中支持两种调试模拟，一种是真机调试，另一种是安装AppCan调试中心。

由于项目中用到了原生插件，请尽量采用真机调试，以便校验效果。

真机调试操作如下：

编码完成后，先在config.xml文件中勾选真机同步调试，填写调试服务器地址，即当前电脑的ip。

保存文件后开始本地打包。

右键该项目的“phone”文件，选择“生成安装包”，进入打包配置，

根据向导提示配置好应用名称、图标、平台、启动页、状态栏，选择要使用的插件，即可打包生成安装包。

注意：如用到了非IDE中的内置的插件，需要通过“自定义插件管理”手动上传，在打包时注意勾选即可。

另外，本地打包出的iOS安装包只支持安装在iOS8系统及以上且越狱环境下。

打包成功后将应用安装至测试机中，即可查看效果。

在IDE中启动真机同步调试服务

此时需注意测试机与电脑一定要在同一网络环境下，注意关闭防火墙。

判断方法：在设备浏览器里输入你的ip和端口，如“192.168.1.213：30060”，看一下访问的页面是否是下图的页面

启动应用，选择要调试的界面，

在调试窗口中修改某处css样式，真机可实时同步看到效果。

在调试窗口修改的东西是不能直接缓存到真机上，只是达到调试预览修改后的效果；需要重新打包，装到到手机才能看到调试后的效果。

8、AppCan调试中心

AppCan调试中心是AppCan IDE为开发者提供的一款可真机同步调试的门户应用，只需通过网络部署子应用（需测试的应用）后，无需二次打包，就可实时测试修改应用。

点击”生成AppCan调试中心”，

进入到AppCan调试中心打包流程，打包成功后安装至测试机中。

在IDE中启动AppCan调试服务中心

在测试中启动调试中心，点击“开始使用”，进入登录页

调试依然需要测试机和电脑在统一网络环境下，注意关闭防火墙。

输入您电脑端的ip地址，点击登录，IDE中左侧导航列表应用均会显示在首页，选择要调试的应用进入即可。

如有需修改，可编辑IDE中代码，然后在当前应用中点击右下角小球，退出到首页，再次点击应用进入，方可看到修改后效果。

9、同步代码

项目在真机调试后无任何问题，就可以同步代码至线上，打包正式版本。

选择要提交的文件，右键选择“Team”，“更新”或“提交”文件。

如此时操作有报错，大多是由于操作不当导致，请翻译报错内容，采取解决办法。

如第一次要去appcan.cn打包，IDE中支持了插件同步线上功能，这样可免去到线上打包前在一个个选取插件了。

首先，插件同步勾选三要素：

1、IDE登录帐号要与AppCan.cn登录帐号一致

2、线下应用代码要上传至线上；

3、当前项目config.xml的应用ID要与线上应用ID保持一致。

满足以上要素后，在IDE中，右键当前应用的phone目录，点击“插件同步勾选”。

IDE会默认勾选当前应用中用到的插件（公共插件或自定义插件，使用自定义插件线上也需上传）。

点击“确认同步”，插件同步成功。

10、云端打包，运营管理

代码更新后，在appcan.cn中开始进行正式包编译。

进入到在线上创建的应用--开发模块中，选择“应用打包”，

按照向导依然配置好相关流程，进行打包。正式版本注意上传证书，相关内容请参看线上文档。

后续应用发布后，就可在应用管理管理中通过启动上报、终端用户等数据分析，推送等服务运营管理你的应用了。

以上为IDE的开发、调试、跟踪、模拟、打包、同步等功能的使用方法，在官网文档中也有对IDE相关功能的介绍。在使用过程中有问题、需求或建议，欢迎提交至论坛吧！

点击进入【直播课堂】