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

uniapp 小程序0到1教程

先说明一下,uni-app的文档很乱

一、注册微信小程序

如果你还没有微信公众平台的账号,请先进入微信公众平台首页,点击 “立即注册” 按钮进行注册。注册的账号类型可以是订阅号、服务号、小程序以及企业微信,我们选择 “小程序” 即可。

接着填写账号信息,需要注意的是,填写的邮箱必须是未被微信公众平台注册、未被个人微信号绑定的邮箱,而且每个邮箱仅能申请一个小程序。

激活邮箱之后,选择主体类型为 “个人类型”,并按要求登记主体信息。主体信息提交后不可修改,该主体将成为你使用微信公众平台各项服务和功能的唯一法律主体与缔约主体,在后续开通其他业务功能时不得变更或修改。

二、微信开发者工具

下载微信web开发者工具,根据自己的操作系统下载对应的安装包进行安装即可。

三、开始构建项目了

我这里使用的是使用Vue3/Vite版

  • npx degit dcloudio/uni-preset-vue#vite-ts my-vue3-project
  • 上面不行的话点击这个链接 ,获取模板 gitee,机器验证

用VS Code打开我们所创建的项目在这里插入图片描述

1.首先下载有关依赖

yarn 或者 npm i 

2.运行

# 运行到 h5   
npm run dev:h5  
# 运行到 app   
npm run dev:app  
# 运行到 微信小程序  
npm run dev:mp-weixin  

注意:

  • H5 是可以在 vscode 上执行, 至于微信小程序, 请看下面操作

  • 微信小程序

  • 首先执行 npm run dev:mp-weixin

  • 执行完毕如下在这里插入图片描述

  • 在项目dist文件夹的dev的会多出一个文件mp-weixin,目录结构即为小程序的结构
    在这里插入图片描述

  • 然后我们打开微信开发者工具, 导入项目
    在这里插入图片描述

  • 导入成功之后
    在这里插入图片描述
    然后我们就要看uni-app文档了!

下面是我自己开发的小程序,可以看一看,有问题评论探讨一下~
请添加图片描述


http://www.kler.cn/a/349920.html

相关文章:

  • hadoop==docker desktop搭建hadoop
  • 新电脑安装系统找不到硬盘原因和解决方法来了
  • Leetcode-两数相加
  • GPB独立站外链:构建长期权威的SEO基础SEO的竞争
  • React进阶之高阶组件HOC、react hooks、自定义hooks
  • 最新最详细的配置Node.js环境教程
  • 仿 Mac 个人网站开发 |项目复盘
  • 设计测试用例的方法
  • phpstorm+phpstudy 配置xdebug(无需开启浏览器扩展)
  • 【Python爬虫实战】XPath与lxml实现高效XML/HTML数据解析
  • 高效数据去重:Redis HyperLogLog的实战指南
  • 全面解析文档对象模型(DOM)及其操作(DOM的概念与结构、操作DOM节点、描述DOM树的形成过程、用DOMParser解析字符串为DOM对象)
  • 【去哪儿-注册安全分析报告-缺少轨迹的滑动条】
  • 最长公共子序列(LCS)
  • C#读取和写入txt文档(在unity中示例)
  • Android 关于引用unityLibrary依赖库无法加载so库问题或脚本报错问题
  • GPT4o,GPTo1-preview, 拼
  • 基于模型预测控制(MPC)储能控制策略-多目标哈里斯鹰(MOHHO)算法的储能容量配置方法
  • 一站式学习Wireshark
  • 低学历可以从事人工智能行业吗?
  • 初学51单片机之I2C总线与E2PROM以及UART简单实例应用
  • pytorch resnet源码分析
  • 【MYSQL】数据库基本操作----DQL(Data Query Language)---基本查询
  • Go基础知识:切片
  • 字符串算法之Rabin-Karp 算法(字符串匹配)详细解读
  • 打家劫舍系列 | Leetcode 198 | 213 | 337 | 动态规划 | 滚动数组