Hbuilder+uniapp 从零开始创建一个小程序

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

当你看到这篇博客的时候,那~说明~我的这篇博客写完了……哈哈哈哈哈哈哈哈。好的,清耐心往下看哈。如果有需要的,可以关注一下小作,后面还有小程序的云开发嗷~

一、申请一个小程序账号(已经有账号的小可爱可以跳过)😏

为什么要申请一个小程序账号?

哈哈哈哈,你如果有这个疑问的话,那你很棒棒嗷~我第一次看到官方网站说要先申请一个账号,我也惊呆了,什么,没有账号我就不能写代码了呗,气人~😡。不气~不气嗷~,因为这套工具包是人家写的。https://developers.weixin.qq.com/miniprogram/dev/framework/quickstart/#小程序技术发展史

操作步骤:

步骤1:从这里进入微信小程序 (qq.com),看下下面的这个页面就往下拉,有一个注册按钮,点击注册。

Hbuilder+uniapp  从零开始创建一个小程序

步骤2:接下来按照下图操作提醒继续往下操作就好小程序 (qq.com),直到注册成功,注册完成。

Hbuilder+uniapp  从零开始创建一个小程序

步骤三:查看小程序后台,AppID,相当于小程序的一个身份正,后续有很多地方用到它。

Hbuilder+uniapp  从零开始创建一个小程序

二、安装工具——微信开发者工具&Hbuilder X

外观:我写这个博客的时候,它俩是长这个样子的哈。

Hbuilder+uniapp  从零开始创建一个小程序

微信开发者工具:微信开发者工具下载地址与更新日志 | 微信开放文档 (qq.com)。进入之后你选择一个稳定版本的下载。

Hbuilder+uniapp  从零开始创建一个小程序

Hbuilder x:HBuilderX-高效极客技巧 (dcloud.io),选择与你电脑匹配的系统,下载正式版本就可以。

Hbuilder+uniapp  从零开始创建一个小程序

备注:如果你是微信小程序原生开发,是不需要用Hbuilder的哈。我们这里因为用到了uniapp框架。

三、微信开发者工具与Hbuilder配合使用!!敲重点

1、开放小程序的服务端口,操作如下。

Hbuilder+uniapp  从零开始创建一个小程序

2、在Hbuider中工具-运行配置-微信开发者工具路径里配置本机的微信开发者工具的路径。

路径指示图

Hbuilder+uniapp  从零开始创建一个小程序

配置开发者工具路径图

Hbuilder+uniapp  从零开始创建一个小程序

四、创建项目 (呼~终于来到了创建项目了)

文字太长,直接在图片里面标注了步骤。自己看 凶狠😣

Hbuilder+uniapp  从零开始创建一个小程序

最后!!!你的项目就被成功创建了呀。你看,这就是你项目目录了啦~

Hbuilder+uniapp  从零开始创建一个小程序

这个时候你就要配置你的小程序ID号了,就说明,你开发的是哪个小程序,步骤还是1、2、3的风格如图。

Hbuilder+uniapp  从零开始创建一个小程序

好,那我们就联通微信开发者工具开看一下效果吧文章来源地址https://www.toymoban.com/news/detail-485266.html

Hbuilder+uniapp  从零开始创建一个小程序
Hbuilder+uniapp  从零开始创建一个小程序

下一篇,小作给你们简单讲解目录里的每个文件是用来干嘛的。

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

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

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

相关文章

  • C# SolidWorks 二次开发 -从零开始创建一个插件(2)

    上一篇我详细讲解了如何创建一个插件,但是无界面无按钮,这种插件适合配合事件偷偷的在后台做点什么事情。今天这篇讲一下如何增加一些按钮到工具栏、菜单上去。 先告诉大家这个东西注册表在哪,因为solidworks在这方面做的不太好,插件你改个名字,就有多个工具栏

    2024年02月15日
    浏览(60)
  • 【云计算 | OpenStack】从零开始使用libvirt创建一个kvm虚机

    环境: os镜像:CentOS-7-x86_64-Minimal-2009.iso qemu-kvm:qemu-kvm.x86_64 10:1.5.3-175.el7_9.6 Libvirt:libvirt-4.5.0-36.el7.x86_64 基于内核的虚拟机 KVM (Kernel-Based Virtual Machine) 需要两个条件:硬件支持全虚拟化、操作系统为Linux。KVM只支持对虚拟机的虚拟CPU、虚拟内存进行管理和调度;针对其他的虚

    2024年02月02日
    浏览(46)
  • 从零开始搭建游戏服务器 第一节 创建一个简单的服务器架构

    由于现在java web太卷了,所以各位同行可以考虑换一个赛道,做游戏还是很开心的。 本篇教程给新人用于学习游戏服务器的基本知识,给新人们一些学习方向,有什么错误的地方欢迎各位同行进行讨论。 本篇教程预计使用Java+Redis+Mongo 本着先完成再完美的原则,从最简单的

    2024年02月10日
    浏览(59)
  • 如何从零开始开发一个小程序

    申请账号 小程序注册页 开发设置 登录 小程序后台 ,我们可以点击左侧菜单 “开发”-“开发管理”,点击后正文上方点击 “开发设置” ,就看到小程序的 AppID(小程序ID) 了 。 小程序的 AppID 相当于小程序平台的一个身份证,后续你会在很多地方要用到 AppID (注意这里要区别

    2024年02月10日
    浏览(65)
  • 【从零开始的eBPF】跑一个helloworld程序

    最近在研究ebpf的应用,网上对较低版本的内核和centos操作系统的相关资料较少,这里记录一个自己环境配置编译运行一个ebpf的helloworld程序的过程。 环境是centos7.9,虚拟机安装内存需要分配高一些,后续编译llvm很吃性能 ebpf需要至少内核是4.9+以上的版本,这里选择了4.18版本

    2024年02月07日
    浏览(46)
  • 记录自己从零开始创建个人小程序到发布的大致过程

    首先不管是要创建个人小程序还是公众号等,都要打开微信公众平台。本文以微信小程序为例,创建一个手工花名片。本文只用于自己学习记录。参考微信社区 1、打开微信公众,点击注册 链接:https://mp.weixin.qq.com/ 2、点击注册后,跳转页面,点击小程序 3、填写注册小程序

    2024年02月12日
    浏览(53)
  • 从零开始创建一个vue3+vite项目并集成element-plus、eslint以及prettier

    项目git地址, 欢迎修改提交,不足地方还请补充批评指正! 项目git地址 ESLint 是一个用于识别和报告在 ECMAScript/JavaScript 代码中发现的模式的工具,其目标是使代码更加一致并避免错误。 ESLint 是完全插件化的。每条规则都是一个插件,你可以在运行时添加更多。你还可以添

    2024年04月09日
    浏览(76)
  • 从零基础开始开发自己的第一个微信小程序

    通过本篇blog,你可以熟悉从零开始,搭建小程序开发环境,并运行起自己的第一个小程序。 1、 注册账号 2、 下载开发工具搭建开发环境 3、 创建工程,编写代码 4、 手机上查看效果 通过以上四步就能创建属于自己的小程序了。 注册完成后是这样的 小程序开发工具下载地址

    2024年02月14日
    浏览(82)
  • 小程序开发:如何从零开始建立你的第一个小程序

    你可能有一个小程序的想法,但它仍然是一个想法。对于开发人员来说,这是一项艰巨的任务,因为你必须确保你有足够的时间来开发你的第一个小程序。如果你决定使用小程序,那就有很多事情要做。创建一个小程序可能是一件非常耗时的事情。除了创建一个自己的小程序

    2024年02月10日
    浏览(79)
  • HBuilder创建uniapp默认项目导入uview(胎教)

    建议更新 我本人在没有更新插件的情况下报错了,找到了**这个大佬**解决问题,所以建议更新插件 先卸载 uni-app(Vue2)编译 再重新安装 uni-app(Vue2) 新建test项目 创建成功之后,右键项目选择在外部资源器中打开 在外部资源器中打开是防止在HBuilder的终端打开cmd权限不足等

    2024年02月07日
    浏览(51)

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

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

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

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

二维码1

领取红包

二维码2

领红包