uniapp开发微信小程序教程(一)

这篇具有很好参考价值的文章主要介绍了uniapp开发微信小程序教程(一)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。



一、微信小程序的简单介绍

微信小程序是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或者搜一下即可打开应用。也体现了“用完即走”的理念,用户不用关心是否安装太多应用的问题。应用将无处不在,随时可用,但又无需安装卸载。

我们身边的小程序:例如进医院需要查看的行程卡、扫描二维码报体温的员工情况日报、包括最近开发的掌上BI等等。

1.优势

  1. 使用起来方便快捷:微信扫描二维码可以打开指定的小程序;微信下拉就可以找到最近使用的小程序,无需下载。
  2. 宣传方便:可以一键分享给好友或者微信群,用户点击即用。
  3. 使用场景多样:可以调用比H5更多的手机系统功能来进行开发,例如GPS定位、录音、拍视频、重力感应等,能开发更丰富的使用场景。
  4. 运行速度快:体积小,支持预加载,用户体验好。
  5. 用户对版本更迭无感,不像APP需要手动更新。

2.劣势

  1. 体积小也是缺点,微信小程序只能2M大小(使用分包技术可以到12M),所以一般的小程序都是用来展示信息和一些简单的交互,不适用于业务复杂的项目。
  2. 技术不是很稳定:大部分功能使用微信提供的API,偶尔会遇上BUG解决不了,可以去论坛发帖子,会有官方开发人员反馈(如果开发时遇到BUG,可以先去论坛搜一下,如果有同样的问题则需要先考虑其他的实现方式)。官方论坛点这里
  3. 功能限制:一些功能只能使用微信提供的接口,比如说活体检测、实人认证等等,这些功能开发时可以实现,但是上线审核的时候不通过,而且这些接口也是付费的(我们之前在微信里做了活体检测和人脸识别,审核不通过,最终做成了APP)。
  4. 资质问题:一部分功能是需要资质的,比如说活体检测和人脸识别等接口的调用只有某些行业可以使用。微信人脸核身接口能力
  5. 技术限制:微信小程序服务端必须要有域名,域名必须是https,也就是说需要SSL证书。
  6. 时间限制:微信小程序开发和部署过程中的某些环节的认证和审核是需要一段时间的,比如说域名的话,需要备案(一般是7个工作日),SSL证书的申请(时间不一),小程序发布(7个工作日,功能简单的小程序大概1-2天就可以审核通过)。

总结:第一,在开发之前先要查一查需要实现的功能小程序是否支持;第二,预留出审核的时间。

二、使用uniapp建立一个示例项目并运行

uni-app 是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、Web(响应式)、以及各种小程序(微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝)、快应用等多个平台。(简单来说就是一套代码,可以打包成微信小程序,也可以打包成APP、H5页面等等,当然也会有一些兼容性的问题,后面有需要再说)。

1.环境准备

开发环境:win7 64位

  1. Javascript 运行环境:Node.js12.1.0【win7安装教程】
  2. 开发工具:HBuilderX最新版
  3. 运行环境:微信开发者工具最新版
  4. 注册小程序账号获取AppID:微信小程序ID申请的流程

2.在HBuilderX中建立示例项目并运行至微信开发者工具

  1. 确定Node.js安装成功:在CMD命令行运行node -v,出现下图则表示配置成功:
    uniapp开发微信小程序,移动端开发,微信小程序,uni-app,小程序
  2. HBuilderX中建立示例项目

uniapp开发微信小程序,移动端开发,微信小程序,uni-app,小程序
3. 在HBuilderX配置微信开发者工具的安装路径
uniapp开发微信小程序,移动端开发,微信小程序,uni-app,小程序

  1. 打开微信开发者工具,开启端口
    uniapp开发微信小程序,移动端开发,微信小程序,uni-app,小程序

  2. 运行demo项目
    uniapp开发微信小程序,移动端开发,微信小程序,uni-app,小程序

  3. demo项目运行成功!!!文章来源地址https://www.toymoban.com/news/detail-619923.html

到了这里,关于uniapp开发微信小程序教程(一)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 使用uniapp开发微信小程序的微信支付流程

    在我们做一些购物车的结算功能时是一定会有支付功能的,那我们如何去做微信支付这个功能呢,首先我们先要理清思路,并且要了解到接口需要哪些数据以及会返回哪些数据 注意:一定要先看接口文档! 创建订单。 ○ 请求创建订单的 API 接口:把(订单金额、收货地址、

    2024年02月09日
    浏览(77)
  • uniapp开发微信小程序实现语音识别,使用微信同声传译插件,

    第一步:在微信小程序管理后台:“设置”-》“第三方设置”-》“插件管理”中添加插件。 但是这个地方,没有搜索到插件,就到微信服务市场 搜索到以后添加到需要的小程序里面,然后返回管理中心查看,就可以看到了 第二步:在配置文件中引入插件 第三步:在需要使

    2024年02月05日
    浏览(52)
  • uniapp开发微信小程序,使用微信同声传译插件,实现语音识别输入文本

    第一步:现在微信小程序管理后台:“设置”-》“第三方设置”-》“插件管理”中添加插件。 但是这个地方,没有搜索到插件,就到微信服务市场去搜微信服务市场  搜索到以后添加到需要的小程序里面,然后返回管理中心查看,就可以看到了 第二步:在配置文件中引入插

    2024年02月09日
    浏览(70)
  • 在 WebStorm 中开发 uni-app - 用vue2实现手机APP(apk) + 微信小程序项目开发方案 webstorm开发的uniapp + hbuilderx进行app 小程序打包

    我们主要分析了如下小程序开发框架,主要包括: 框架 技术栈 案例 微信小程序 支付宝小程序 百度小程序 头条小程序 H5 App uni-app Vue 丰富 ⭕ ⭕️ ⭕️ ⭕ ⭕️ ⭕ Taro React 丰富 ⭕ ⭕ ⭕ ⭕ ⭕ ⭕ wepy Vue 丰富 ⭕ ❌ ❌ ❌ ❌ ❌ mpvue Vue 丰富 ⭕ ❌ ❌ ❌ ⭕️ ❌  首先,就要排

    2024年02月05日
    浏览(97)
  • 在 WebStorm 中开发 uni-app - 用vue2实现手机APP(apk) + 微信小程序项目开发方案 webstorm开发的uniapp + hbuilderx进行app 小程序打包

    我们主要分析了如下小程序开发框架,主要包括: 框架 技术栈 案例 微信小程序 支付宝小程序 百度小程序 头条小程序 H5 App uni-app Vue 丰富 ⭕ ⭕️ ⭕️ ⭕ ⭕️ ⭕ Taro React 丰富 ⭕ ⭕ ⭕ ⭕ ⭕ ⭕ wepy Vue 丰富 ⭕ ❌ ❌ ❌ ❌ ❌ mpvue Vue 丰富 ⭕ ❌ ❌ ❌ ⭕️ ❌  首先,就要排

    2023年04月15日
    浏览(81)
  • WebStorm开发uni-app ,用vue2实现手机APP(apk) + 微信小程序多端项目开发方案 webstorm开发的uniapp + hbuilderx进行app 小程序打包

    我们主要分析了如下小程序开发框架,主要包括: 框架 技术栈 案例 微信小程序 支付宝小程序 百度小程序 头条小程序 H5 App uni-app Vue 丰富 ⭕ ⭕️ ⭕️ ⭕ ⭕️ ⭕ Taro React 丰富 ⭕ ⭕ ⭕ ⭕ ⭕ ⭕ wepy Vue 丰富 ⭕ ❌ ❌ ❌ ❌ ❌ mpvue Vue 丰富 ⭕ ❌ ❌ ❌ ⭕️ ❌  首先,就要排

    2024年02月11日
    浏览(75)
  • Webstorm 入门级玩转uni-app 项目-微信小程序+移动端项目方案

    1. Webstorm uni-app语法插件 : Uniapp Support Uniapp Support - IntelliJ IDEs Plugin | Marketplace 第一个是不收费,第二个收费 我选择了第二个 Uniapp Support ,有试用30天,安装重启webstorm之后,可以提高生产率。 补充 有小伙伴说搜索不到插件,目前webstorm 2022.3版本还能搜到2个: # Uniapp Tool  

    2024年02月11日
    浏览(108)
  • uni-app开发微信小程序

    编辑器:HubilderX 运行环境:微信开发者工具 技术栈:uni-app + vue + uView + uCharts + LeanCloud 创建微信小程序项目时,我才用了vue前端框架 PS:用的是HbuilderX编辑器 1. 注册微信小程序 注册完后,获取微信小程序的AppID,并在manifest.json文件配置; 2. 导入uView和uCharts组件库 使用uni-

    2024年02月16日
    浏览(89)
  • 高校大学校园后勤移动报修系统 微信小程序uniapp+vue

    本文主要是针对线下校园后勤移动报修传统管理方式中管理不便与效率低的缺点,将电子商务和计算机技术结合起来,开发出管理便捷,效率高的基于app的大学校园后勤移动报修app。该系统、操作简单、界面友好、易于管理和维护;而且对后勤报修信息具有较强的针对性、实

    2024年02月03日
    浏览(51)
  • 使用微信开发工具开发微信小程序(二)——协同工作、发布与事件绑定

    1.了解项目成员的组织结构 2.小程序开发流程 3.不同项目成员的权限 4.开发者权限 开发者权限 :可使用小程序开发者工具及对小程序的功能进行代码。 开发体验者权限 :可使用体验版小程序。 登录权限 :可登录小程序管理后台,无需管理员确认。 开发设置 :设置小程序服务器

    2024年02月09日
    浏览(126)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包