当前位置: 首页 > news >正文

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

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

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

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

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

操作步骤:

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

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

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

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

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

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

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

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

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

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

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

路径指示图

配置开发者工具路径图

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

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

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

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

好,那我们就联通微信开发者工具开看一下效果吧

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

http://www.lryc.cn/news/27487.html

相关文章:

  • 亚商投资顾问早餐FM/0303支持新能源汽车消费
  • Spring Boot 整合分布式缓存 Memcached
  • 嵌入式学习笔记——STM32单片机开发前的准备
  • 客户案例|FPGA研发管理解决方案:UniPro瀑布+敏捷 打造高效能组织
  • 【信息学奥赛】1400:统计单词数
  • # 技术详解: 利用CI同步文章以及多端发布
  • 分形维数的计算方法汇总
  • 微积分小课堂:积分(从微观趋势了解宏观变化)
  • 4道数学题,求解极狐GitLab CI 流水线|第4题:合并列车
  • 代码规范简述
  • 【Java集合框架】篇五:Map接口
  • Typroa安装教程
  • 【MySQL】存储引擎
  • 芯驰(E3-gateway)开发板环境搭建以及调试遇到问题的解决
  • 【大数据监控】Prometheus、Node_exporter、Graphite_exporter安装部署详细文档
  • 《C++ Primer》 第十一章 关联容器
  • WebRTC标准与框架解读(1)
  • 数据结构的一些基础概念
  • 【Python每日一练】总目录(不断更新中...)
  • latex插入图片(自用)
  • 【微信小程序】-- 网络数据请求(十九)
  • K8S 实用工具之一 - 如何合并多个 kubeconfig?
  • 阿里云ECS服务器的6大功能组件
  • 外贸建站多少钱?不同预算对应的建站方案!
  • Vue3中hook的使用及使用中遇到的坑
  • 数据库-差集交集并集
  • spark性能调优(四):网络
  • 高性能 WPF 图表控件LightningChart.NET:支持从 Web 服务器获取数据 | 附最新版试用下载
  • 文科女生月入14k背后:转行IT软件测试不是谁都学得来!
  • GB28181监控视频统一汇聚平台LiveGBS将海康大华华为宇视等厂家监控设备统一接入后如何生成固定播放链接或者固定的流地址可以直接无插件播放或者拉取