YonStudio开发工具使用说明

注：若开发者用Studio导入一个项目后，这个项目不是模板详情中介绍的应用类型，此时，需要做以下修改：1、打开项目所在的路径下，找到.apicloud目录(此目录为隐藏文件夹)，用文本编辑器打开.project文件；2、修改其中的apptype字段(native-app表示Native App, mx-app表示MX APP, cli-app表示App Clip)

创建模版文件

Studio上可以创建一些模版文件，比如html，stml，js，css，json等

在项目根目录上右键--新建，可以创建html，js，css，json文件
在pages目录上右键--新建，可以创建stml，js，css文件
在res目录上右键--新建，可以创建key.xml, info.plist, mainfest.xml等文件

注：选择新建类型的文件后，在弹出的输入框中只需输入文件名即可，不需要输入后缀名

stml编译

菜单栏--编译项目功能，会编译项目下的stml文件，编译结果查看控制台输出

移动打包

在项目根目录上右键--编译--移动打包，打开移动打包界面，做相应的操作，如图所示

自定义loader

在项目根目录上右键--编译--编译自定义Loader，打开自定义loader界面，做相应的操作，如图所示

WiFi同步

查看WiFi同步的ip和端口号
- 顶部菜单 - 终端 - 设备列表，弹出复选框，选择通过WIFI连接新设备，查看ip
- 左侧功能栏，选择真机同步按钮，也可以弹出复选框，选择通过WIFI连接新设备，查看ip
- 注：连接时wifi设备要和Studio连接在同一个wifi下

在项目名上右键，会弹出wifi全量和增量同步菜单，做相应的操作(同步所有wifi设备)，如图所示

若有wifi设备连接时，顶部菜单 - 终端 - 设备列表，会弹出所连接的wifi设备，选择相应的设备进行同步

如有wifi设备连接时，选择左侧功能栏--真机同步按钮，会弹出所连接的wifi设备，选择相应的设备进行同步
注1:如果项目中有stml文件，Studio会先编译stml文件
注2:进行指定设备同步时，会有相关的标记做指示，如图所示:
- (1) 相关设备前有WIFI标记，表示该设备处于wifi连接状态；
- (2) 相关设备前有USB标识，标识该设备处于usb连接状态；
- (3) 同一个设备既可以处于wifi连接状态，也可以处于usb连接状态；进行相关操作时相关的状态

WiFi自动同步

打开设置界面，依次点击扩展--APICloud 勾选 Auto Sync(使用之前，注意该设置的使用说明)

修改wifi端口号

打开设置界面，选择常用设置，修改wifi端口号

USB同步

在项目名上右键，会弹出usb同步相关菜单，做相应的操作(同步所有usb设备，注：usb同步不支持iOS设备)，如图所示

如有usb设备连接时，顶部菜单 - 终端 - 设备列表，会弹出所连接的usb设备，选择相应的设备进行同步

如有usb设备连接时，选择左侧功能栏--真机同步按钮，会弹出所连接的usb设备，选择相应的设备进行同步
注1:如果项目中有stml文件，Studio会先编译stml文件
注2:进行指定设备同步时，会有相关的标记做指示，如图所示:
- (1) 相关设备前有WIFI标记，表示该设备处于wifi连接状态；
- (2) 相关设备前有USB标识，标识该设备处于usb连接状态；
- (3) 同一个设备既可以处于wifi连接状态，也可以处于usb连接状态；进行相关操作时相关的状态

html和stml实时预览

在html或stml编辑页面，右键弹出实时预览菜单，预览html或stml页面(如果预览的是stml页面，Studio会先编译stml文件)，如图所示

wifi真机预览

在html或stml编辑页面，右键弹出WiFi真机实时预览菜单，同步在wifi设备上预览html或stml页面(如果预览的是stml页面，Studio会先编译stml文件)

代码提示

Studio采用两种方式的代码提示

1、代码片段: Studio内置了api对象和几乎所有平台模块的代码片段
- api对象下的代码片段输入方式:输入api.接口名，选择相应的接口片段，回车即可完成一段代码的自动输入
- 模块代码片段输入方式：输入模块名.接口名会有相关的代码提示，选择相应的接口，回车即可完成一段代码的自动输入
2、js代码提示: Studio将api对象和几乎所有平台模块都做了js封装
- 输入对象名，即可调出这个对象下的所有接口，选择相应的接口，回车，输入左括弧，自动完成右括弧的输入，同时，如果这个接口有参数时，也可提示这个接口的参数

中英文切换

打开命令面板，输入:Configure Display Language,点击,选择相关的语言

在微信开发者工具预览

若开发的项目为MX类型的APP，项目根目录下右键，点击在微信开发者工具预览，Studio会先弹出输入微信小程序的appid的输入框(可以使用默认值，但是为了方便在微信开发者工具中调试，建议换成开发者自己在微信后台申请的appid)，输入完成后，Studio会将当前项目编译成微信小程序，并在当前项目的根目录下生成out-mp目录存放编译后的小程序代码

注意：

1、这一步的操作前提是本地需要安装微信开发者工具
2、在windows平台下，第一次操作时需要开发者手动选择微信开发者工具安装的根目录，如果后期安装路径有更改，需要修改安装路径，具体操作为：打开Studio 设置界面 -- 常用配置 -- 找到微信开发者工具的根目录并配置

增量编译微信小程序

经过上一步的操作，会打开本地安装微信开发者工具，如果项目中stml文件有改动，可以点击增量编译微信小程序，Studio会增量编译当前项目，编译完成后，微信开发者工具有监听文件的更改的功能，会自动加载项目。

编译为微信小程序【全量】

这一步的操作和增量编译微信小程序主要的区别是:

1、会全量编译当前项目下的所有stml文件
2、如果当项目中有非stml文件的改动，会影响到小程序的代码，应该进行这一步操作
3、这一步编译出来的小程序代码可用着release版本

tips1：

以上三步是调试小程序的主要功能，一般的操作流程应该是：

1、在微信开发者工具预览：这一步主要是用来确认微信小程序的appid和打开微信开发者工具
2、增量编译微信小程序 | 编译为微信小程序【全量】：这一步增量或全量编译当前项目，微信开发者工具会自动同步文件的更改

tips2：

编译小程序功能只在Windows和Mac平台下生效
运行微信开发者工具，需要微信开发者工具处于登录状态
启动微信开发者工具，需要打开服务端口，具体操作步骤为：打开微信开发者工具 -- 设置 -- 安全设置 -- 安全 -- 开启服务端口