uni-app开发小程序以及项目部署流程

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

作者也是刚开始接触小程序开发,本次小程序开发使用的uni-app,记录下小程序的开发过程。

前期准备工作

        作者使用的开发工具:HBuilder x、微信开发者工具。

创建uni-app项目

        详细步骤可参考uni-app官网-快速上手,下面简述下作者的使用过程:

        1.在HBuilder X 中打开如下路径文件 -> 新建 -> 项目。

        2.创建以下项目。

uni-app开发小程序以及项目部署流程

         3.配置微信开发工具。

uni-app开发小程序以及项目部署流程

        4.登录微信公众平台获取appid,进入项目的manifest.json配置appid       

uni-app开发小程序以及项目部署流程

uni-app开发小程序以及项目部署流程

        5.后端接口的配置,如下图所示配置请求域名,域名必须是https的http的需要进行证书认证等。注意:uploadFile 和 downloadFile等如果项目有需要必须要配置,没有配置升级后会不起效。

uni-app开发小程序以及项目部署流程

 文章来源地址https://www.toymoban.com/news/detail-486088.html

代码编辑

        在使用uni-app编辑代中与使用html编写代码差别不大,如果你对html比较熟悉应该在开发小程序时会的心应手。uni-app项目中支持vue2、和vue3。

uni-app开发小程序以及项目部署流程
        代码的运行如下图所示:

uni-app开发小程序以及项目部署流程

        代码运行后的结果要以真机运行结果为准,部分功能电脑模拟和手机模拟可能结果不一致,进入开发工具后手机调试:

uni-app开发小程序以及项目部署流程

程序升级

        在代码调试完成后对小程序进行升级。步骤如下:

        1.上传代码 

uni-app开发小程序以及项目部署流程        2.小程序公众平台版本管理提交审核uni-app开发小程序以及项目部署流程

         3.将预览图片和视频做好上传,便于微信方审核,如果材料不全而且功能不明确的话微信方会驳回提交。

uni-app开发小程序以及项目部署流程

         4.审核完毕后微信方会给你发审批通过信息,在下图审核版本后就可以点击进行发布了。

uni-app开发小程序以及项目部署流程

 

到了这里,关于uni-app开发小程序以及项目部署流程的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

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

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

相关文章

  • 跨平台应用开发进阶(六十二):如何把 uni-app APP项目转换成小程序

    随着移动互联网的快速发展,移动应用已成为生活中不可或缺的一部分。与此同时,跨平台开发也得到越来越多的关注,因为它可以提高应用程序的效率并降低开发成本。 uni-app 是一种跨平台开发框架,基于 Vue.js ,并且可以在多个平台如微信小程序、支付宝小程序、H5等上运

    2024年02月15日
    浏览(67)
  • WebStorm开发uni-app ,用vue2实现手机APP(apk) + 微信小程序多端项目开发方案

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

    2024年02月08日
    浏览(75)
  • 微信小程序开发者工具运行 uni-app 项目时报错 Uncaught (in promise) undefined

    开发者工具控制台报错 Uncaught (in promise) undefined,如图: 该错误主要是因为调试基础库过高或过低导致的。 在 微信开发者工具 — 详情 — 本地设置 — 调试基础库 中,将调试基础库版本调低或调高即可 调试基础库:此处选择的基础库为微信中的基础库版本,且仅用于开发者

    2024年02月12日
    浏览(69)
  • uni-app+vue3+ts项目搭建完整流程

    项目代码同步更新至码云 uni-vue3-ts-template 利用 uni-app 开发,有两种方法: 通过 HBuilderX 创建(需安装 HBuilderX 编辑器) 通过命令行创建(需安装 NodeJS 环境),推荐使用 vscode 编辑器 这里我们使用第2种方法,这两种方法官方都有详细介绍 点击查看官方文档 安装 Vue3 插件,点

    2024年02月03日
    浏览(73)
  • uni-app小程序使用DCloud(插件市场)流程

    一、DCloud(插件市场) DCloud 是uni-app官方插件市场,里面有官方、团队、个人发布的众多插件,包括 uni-ui、uni-pay 等。而像 uni-ui 这种大型组件库都有官方文档可参考,但一些团队或个人发布的小型插件没有文档,只有下载、导入按钮。本文就以电子 签名插件 jushi-signature 为

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

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

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

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

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

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

    2024年02月11日
    浏览(69)
  • UNI-APP开发微信小程序的基本流程

    需提前准备的工具:HBuilder X ,微信开发者工具 登录小程序官网,如已有账号,则直接登录。 无账号,申请完账号后,进入账号填写相关信息,获取appId。 获取appId:【开发-开发管理-开发设置】 【文件】-【新建】-【项目】: 点击【manifest.json】,将微信小程序的配置信息填

    2024年02月06日
    浏览(45)
  • 快速使用uni-app搭建小程序项目

    HBuilder是uni-app官方团队专门定制的编辑器,它对Vue做了大量优化投入,且支持uni-app官方库Api的智能提示和推断,同时,我们也可以在通过编辑器快速的创建各种场景下的项目模板,总之HBuilder是用uni-app进行应用开发的首选编辑器,可以访问其官网进行下载安装,点击如下链接

    2024年02月15日
    浏览(110)

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

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

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

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

二维码1

领取红包

二维码2

领红包