快速开始

支持的平台

简称 说明
android Android平台
ios iOS平台
WX 微信小程序平台
DD 钉钉E应用
web 移动Web应用

系统环境要求

兼容 Mac 和 win 操作系统。

前置软件安装

  • 安装node.js , 版本请用 10 以上。下载地址:https://nodejs.org/en/ 。
  • 安装 git , 下载地址: https://git-scm.com/downloads 。

安装mtl

npm -g install mtl-cli

在安装过程中 ,如果是Mac电脑遇到安装失败,权限不够,需要加上 sudo 。 例如: sudo npm -g install mtl-cli 。 安装完成后,运行下面命令,检查是否安装成功

mtl --version   //查看版本号

创建工程

mtl 根据模板脚手架创建一个工程

mtl create [appname] 

appname 是工程名称

  • 此参数是必填项。参数不能是特殊字符 ,长度不要超过64。例如mtl-demo、mtl@……%demo 这样的工程命名都是不对的;
  • 本地已创建的工程不能同名再创建,造成本地目录同名;

选择样版工程

  • 一个react工程,react工程下又有mtl-react-empty工程模版供用户选择使用 。

  • 一个html工程,html工程下又有mtl-empty和mtl-demo两个工程模版供用户选择使用 。

注意  如果创建的是react工程 ,在创建完成后 ,进入到工程根目录下,一定要执行npm install  命令 ,下载react 工程需要的依赖包。

创建页面

mtl  add-page [pagename] 

pagename

  • 此参数是必填项,pagename 不能是特殊字符和汉字,长度不能超过64个字符;
  • 用户根据这个名称,替换模板页面中的模板变量,进行填槽,形成想要的页面。
  • 如果提示The current path is not MTL-Project,需要cd [appname]工程目录下,执行mtl add-page [pagename]即可。

用户选择想要添加的页面模板

  • empty:标准空页面 <--默认
  • list:标准列表页面
  • login:标准登录页面

添加插件引用原生功能

mtl  add-plugin 

现在拥有的插件 ,持续开发中:

用户进入查看列表。
“回车” 确认保存到project.json 文件中

调试

mtl debug [ iOS | Android | WX | DD]

android 调试

  • android 平台需要配置好 android开发环境 adb工具(adb 工具可以到开发中心下载)。安装android 模拟器 ,例如 网易模拟器 MuMu ,确保adb 连接通 。

iOS 调试

  • iOS 需要搭建好xcode 开发环境;

微信小程序调试

  • 微信小程序需要安装微信小程序工具:到微信公众平台去下载,下载地址。 命令行进行mtl debug wx 后 ,用微信小程序工具导入当前工程目录./output/wx/debug/proj ,这样就可以在微信小程序工具下看到 修改app目录下工程源码的调试效果。

钉钉小程序调试

  • 钉钉小程序需要安装 蚂蚁金服开放平台 小程序工具,下载地址。命令行进行mtl debug DD 后 ,用钉钉小程序工具导入当前工程目录./output/dd/debug/proj ,这样就可以在钉钉小程序工具下看到 修改app目录下工程源码的调试效果。

调试host配置和功能说明:

  • (仅调试微信需要)配置pc的host 文件如下: 添加“ 127.0.0.1 mobile.yyuap.com ” ;
  • 修改文件热更新,如果在项目工程下,修改了app目录下的工程源码都会自动更新到output平台目录下的工程目录,需要在 android ,iOS ,wx小程序工具 ,钉钉小程序工具 里刷新就可以看到修改的效果。
  • 友情提示,终端命令行在调试状态下 ,一直处于工程的监听中 ,请不要中断当前的状态 ,直到想要终止调试,进行其他操作。

预览

mtl preview [ iOS | Android | WX | DD |Upesn]

android预览说明:

  • 命令行执行预览android功能 ,需要用真机预先安装"android预览APP" (预览APP在下载中心中下载安装)。在真机安装后,打开预览APP的扫码功能 ,扫码识别后 ,就可以验证项目开发的真机预览功能。

iOS 预览说明:

  • 命令行执行预览iOS功能 ,需要用真机预先安装"iOS预览APP" (预览APP在下载中心中下载安装)。在真机安装后,打开预览APP的扫码功能 ,扫码识别后 ,就可以验证项目开发的真机预览功能。

微信小程序预览说明:

  • 命令行执行预览微信小程序功能 ,需要用真机的微信APP,用微信的扫码功能 ,扫码识别后 ,就可以验证项目开发的真机预览功能。

钉钉小程序预览说明:

  • 命令行执行预览钉钉小程序功能 ,需要用真机的钉钉APP,用钉钉的扫码功能 ,扫码识别后 ,就可以验证项目开发的真机预览功能。

友空间预览说明:

  • 命令行执行预览Upesn功能 ,需要用真机的友空间APP,用友空间的扫码功能 ,扫码识别后 ,就可以验证项目开发功能的真机预览功能。

预览功能说明:

  • 预览命令行执行后 ,会在pc开发设备形成二维码;
  • 修改文件热更新,如果在项目工程下,修改了app目录下的工程源码都会自动更新到后台预览服务中,需要在 android ,iOS ,微信 ,钉钉,友空间 里刷新就可以看到更新的效果。
  • 友情提示,终端命令行在预览状态下 ,一直处于工程的监听中 ,请不要中断当前的状态 ,直到想要终止预览,进行其他操作。

构建

后续构建功能文档由友空间提供