文档

开发多端小程序教程

更新时间:

本教程指导您在阿里云小程序开发者工具中使用uni-app跨平台开发扩展插件开发多端小程序。

前提条件

步骤一:创建和配置小程序项目

完成以下操作,创建小程序项目:

  1. 打开小程序开发者工具,选择跨平台小程序 > uni-app

  2. 单击+创建小程序项目。

  3. 在左侧工具栏单击npm模块,然后选择安装全部项目依赖。

    说明

    依赖安装时间可能较长,和网络环境有关,请耐心等待。

    依赖安装成功后,编译报错消失,如下图所示。

uni-app项目创建成功后,您就可以开发uni-app跨端工程了。主要项目目录如下:

  • src/:uni-app工程的源码目录。详细信息,请参见uni-app 工程目录结构

  • dist/:小程序构建的文件:

    • dev/mp-alipay:支付宝小程序结构文件。

    • dev/mp-weixin:微信小程序结构文件,需要结合uni-app插件使用。详细使用说明,请参见uni-app跨平台开发扩展使用教程

      说明

      目前仅支持开发支付宝和微信端小程序。

步骤二:开发小程序

您可以在小程序开发者工具中直接进行代码开发。本教程中以小程序开发者工具中自带的小程序为例。

  1. 在小程序开发者工具中,打开src/pages/index/index.vue文件,并将title修改为Hello World。

  2. 保存修改。

    IDE会触发自动编译,编译完成后的模拟器效果,如下图所示。

步骤三:预览和调试

完成以下操作,调试小程序:

  1. 在小程序开发者工具顶部菜单栏,单击预览,默认选中自动预览。

    预览
  2. 编译完成后,请保持手机支付宝在前台运行,小程序会自动显示。您也可以单击扫码预览,然后使用支付宝客户端扫描二维码预览小程序。

步骤四:上传小程序

小程序调试完成后,您可以直接单击上传将开发好的小程序上传至开放平台。

使用咨询

如果在跨端开发中遇到任何问题,您可以通过搜索钉钉群(支付宝IDE跨平台小程序开发者群,群号 : 23356164)入群咨询。

  • 本页导读 (0)
文档反馈