开发一个小程序 Demo|学习笔记

简介: 快速学习 开发一个小程序 Demo

开发者学堂课程【mPaaS 小程序开发实战 开发一个小程序 Demo】学习笔记,与课程紧密联系,让用户快速学习知识。

课程地址:https://developer.aliyun.com/learning/course/301/detail/3508


开发一个小程序 Demo

内容介绍:

一、Mpaas 小程序 Demo 的一些使用方法以及技巧

 

一、Mpaas 小程序 Demo 的一些使用方法以及技巧

首先要登录到 Mpaas 小程序的管理后台,需要下载一份配置文件才能登录,配置文件是绑定这个应用的,现在看到这个是 Mpaas 小程序的管理后台的首页。每个应用实际上都是一份配置文件。

image.png

随机选一个应用,之后在一级菜单选择小程序,二级菜单选择小程序发布。然后在配置管理里面,这里有个 ide 配置管理,可以下载配置文件,导入到 ide 中就可以登录了。登录 id 的用户名是控制台的这个用户名,密码是配置文件的一个动态密码。

image.png

小程序一定要选择 Mpaas 类型的,Mpaas 小程序提供了三个模板,前两个是多端开发的模板,另一个后面会进行介绍。

小程序设立模板,如果已经创建可以直接打开。打开之后看到。在右上角有一个登录,登录的时候,需要新增一个登录环境,在这里要上传配置文件,上传之后,登录,密码是之前的动态密码。

这时 ID 提示需要安装依赖。在I D的插件里面可以安装,安装成功之后,可以在这个 I D 里面看到这个小程序的本地预览。

image.png

首先在左侧这边有一个插件,这个是 Mpaas 的工具箱和相关的一些工具的集成。点进去,有白名单的设置,白名单的设置就是机调试以及预览的时候,一定要有一个白名单的概念,这个白名单对应的就是 app 端的一个用户的 I D,匹配上的话才能拉入白名单。

image.png

小程序设置里面有很多的配置项,如果配置不对,可能小程序是没有办法正常的显示出来的,注意一定要选择一个小程序。然后点击一下配置,有个提示,意思是这个小程序之前的配置不合理,但是这个小程序会检测代码中合理的配置应该是什么。若显示配置可能是错误的,可以选择自动修改,修改之后,配置基本信息可以到版本号,假如两个平台想要遇到,可以最低版本填为:0.0.0.0,最高版本可以不填,主入口就是小程序的主入口。有两个地方是比较容易出错,即主入口和是否显示底部导航栏。主入口一般来说 App.json 的第一个基本就是主出口。

image.png

点击预览,当然白名单所匹配的用户才能进行预览。可以看到屏幕上的 app,已经相当于 Demo 中得 app,一般东西都是有的。现在先调试预览,在真机上已经下载到小程序的文件包,如下图:

image.png

当发了一个预览包,在 id 上选的是小程序实例,可以看这个小程序测试包。如下图:

image.png

上传功能,上传实际上就是这相当于上传了一个正式的那个小程序包。如果想正式发布的话,还需要在 mpaas 的控制台去手动发布一次。现在线上版本是1.0.58,现在要上传的是1.0.59。如果有差错,会在上传日志里面体现出来。

上传完成之后,再回到控制台。在小程序测试包里,1.0.59测试包已经是代发布状态了,相当于直接传到了的控制台上。

小程序的基本的功能就是这些,当然还有一些比较特殊的功能,如清除缓存,就是构建的过程中,会在系统有一些文件,直接点击清除就可以了。导出功能是,比如刚才上传得1.0.59版本,想上传到本地,可以直接导出,最新的版本就上传在这了,导出之后,点击下载就可以了

image.png

以上是 Mpaas 小程序基本功能。

相关文章
|
2月前
|
人工智能 小程序 前端开发
一个小程序轻量AR体感游戏,开发实现解决方案
针对青少年运动兴趣不足问题,AR体感游戏凭借沉浸式互动体验脱颖而出。结合小程序“AI运动识别”插件与WebGL渲染技术,可实现无需外设的轻量化AR健身游戏,如跳糕、切水果等,兼具趣味性与锻炼效果,适用于儿童健身及职工团建,即开即玩,低门槛高参与。
|
2月前
|
移动开发 小程序 前端开发
小程序开发平台有哪些?哪个好
小程序的开发方式丰富多元,开发团队可根据自身的技术背景、项目具体需求以及资源状况,灵活挑选最为适宜的开发路径。以下将详细介绍几种主流的小程序开发方式。
322 1
|
2月前
|
运维 小程序 数据可视化
小程序开发平台有哪些?SaaS小程序制作平台哪个好
小程序开发模式详解:自主开发、SaaS小程序制作平台与外包全对比 选择合适的小程序开发模式,是项目成功的基石。这三种模式在成本、周期、控制力和灵活性上各有千秋,适用于不同阶段和不同类型的企业。下面我们将逐一深入剖析。
282 7
|
11月前
|
移动开发 小程序
thinkphp+uniapp开发的多端商城系统源码/H5/小程序/APP支持DIY模板直播分销
thinkphp+uniapp开发的多端商城系统源码/H5/小程序/APP支持DIY模板直播分销
512 0
|
小程序 前端开发 JavaScript
在线课堂+工具组件小程序uniapp移动端源码
在线课堂+工具组件小程序uniapp移动端源码
275 0
在线课堂+工具组件小程序uniapp移动端源码
|
移动开发 小程序 数据可视化
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
基于npm CLI脚手架的uniapp项目创建、运行与打包全攻略(微信小程序、H5、APP全覆盖)
2636 3
|
小程序 前端开发 Java
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
JavaDog Chat v1.0.0 是一款基于 SpringBoot、MybatisPlus 和 uniapp 的简易聊天软件,兼容 H5、小程序和 APP,提供丰富的注释和简洁代码,适合初学者。主要功能包括登录注册、消息发送、好友管理及群组交流。
354 0
SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目
|
小程序 API
微信小程序更新提醒uniapp
在小程序开发中,版本更新至关重要。本方案利用 `uni-app` 的 `uni.getUpdateManager()` API 在启动时检测版本更新,提示用户并提供立即更新选项,自动下载更新内容,并在更新完成后重启小程序以应用新版本。适用于微信小程序,确保用户始终使用最新版本。以下是实现步骤: ### 实现步骤 1. **创建更新方法**:在 `App.vue` 中创建 `updateApp` 方法用于检查小程序是否有新版本。 2. **测试**:添加编译模式并选择成功状态进行模拟测试。
451 0
微信小程序更新提醒uniapp