微信小程序注册&开发&发布流程（个人版）

1. 小程序注册

注册地址https://mp.weixin.qq.com/wxopen/waregister?action=step1

注册界面截图：

官网给出的发布流程：

注册完成后应该可以看见自己的小程序id（本人由于原来账号被冻结，所以将自己原来的小程序账号找回后的操作）

截图如下：

2. 开发

2.1 开发及调试工具

HBuilder 下载地址微信小程序开发工具 下载地址

2.2 开发步骤

2.2.1 新建项目

使用HBuilder创建项目，点击文件—>新建—>项目，如图：

在弹出的窗口选择uni-app，填写项目名称和项目地址，然后我们可以根据需求选择模板，这里我选择使用内置uni-ui的模板，如图：

创建完成后的目录如下：

┌─components uni-app组件目录 │ └─comp-a.vue 可复用的a组件 ├─hybrid 存放本地网页的目录，详见 ├─platforms 存放各平台专用页面的目录，详见 ├─pages 业务页面文件存放的目录 │ ├─index │ │ └─index.vue index页面 │ └─list │ └─list.vue list页面 ├─static 存放应用引用静态资源（如图片、视频等）的目录，注意：静态资源只能存放于此 ├─wxcomponents 存放小程序组件的目录，详见 ├─main.js Vue初始化入口文件 ├─App.vue 应用配置，用来配置App全局样式以及监听 应用生命周期 ├─manifest.json 配置应用名称、appid、logo、版本等打包信息，详见 └─pages.json 配置页面路由、导航条、选项卡等页面类信息，详见

为了方便我们在创建一个common目录如图，因为我们使用的是uni-ui，所以必须要有uni-ui的样式，这里我已经将hello-uni-app官方演示案例下的common拿了过来，如下图所示：

全局使用uni-ui的样式，在App.vue中引入uni.css；

@import "./common/uni.css";

此时，项目创建完成，现在我们就可以运行了，前提是必须安装微信开发者工具，才能调试微信小程序

2.2.2 运行项目

选择要运行的项目页面，创建项目完成后，默认会生成index页面，进入index页面，Ctrl+R运行，弹出界面如下：

根据需求选择点击运行，

如果是小程序，则需要配置小程序的安装路径，确保能够打开小程序开发者工具。

运行配置，主要配置开发工具的安装路径，确保能够打开并调试程序，如图：

点击运行设置后，在弹出的页面配置开发工具的安装路径，如图：

执行步骤2，选择微信开发者工具，在1或者2之间都可以选择，选择完成后会自动打开微信开发者工具，自动编译运行，在HBuilder的控制台会出现对应的控制台窗口，如下图：

2.2.3 优化调试

当存在多个页面时，运行项目默认打开index页面，我们可以自定义配置调试页面。

我在pages目录下新建了一个页面page1，并且同事创建出了存放page1页面的同名目录，已经将page1注册到了pages.json中。接下来就开始配置启动页，我们让启动页为刚创建的page1页面。

"condition":{ "current":1, "list":[ { "name":"page1", "path":"pages/page1/page1" } ] }

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-w0R3CoQ0-1593593419644)(F:\WuDaInfo-Xian\学习笔记\images\2020-07-01_113356.png)]

保存，点击控制台的重新运行。

回到微信开发者工具，选择指定的编译页面，这是就可以看见我们刚才配置的名为page1的页面。

到这里，开发流程基本结束。

备注：

请求接口报错，不在域名列表

处理：在微信开发者工具—>详情—>本地设置—>开启本地不校验合法域名，如下图

​

3. 小程序发布

3.1 将appID填入到使用uni-app开发的项目manifest.json中。

结合DCloud官网给出的发布流程

链接：https://uniapp.dcloud.io/quickstart?id=发布为小程序](https://uniapp.dcloud.io/quickstart?id=发布为小程序)

经过编译后在微信小程序开发者工具可以看见小程序的基本信息，

3.2 上传

上传完成后，回到小程序管理后台。在版本管理中可看见刚才上传的开发版本。

3.3 提交审核

点击提交审核，然后填写提交审核表单，最后提交，完成后可在版本管理中看见审核版本。

3.4 审核完成后会自动生成线上版本

审核完成后会自动生成线上版本，最后手动点击发布，发布完成后，可能有一些延迟，过10分钟以后就可以在小程序中搜索到自己的小程序。

3. 小程序审核不通过的原因

小程序服务类目所对应的页面中的核心内容与该类目是否一致。类目与页面提供的内容是否一致。小程序简介没有介绍小程序功能。小程序提供的服务和内容必须是正式的，不能以测试内容提交，多次以测试内容提交。部分图片显示被压缩体检不好。搜索框及少数下才能选中，页面评论点击无响应，页面图片分辨率尺寸失真。不得展示和推荐第三方小程序。比如：不能做小程序导航，不能做小程序链接互推，小程序排行榜等。含有声音视频内容，没有补充相关对应类目。有账号体系的小程序，除自有登录方式，必须支持微信授权登录。必须保证用户在该页面能使用该服务类目，不得隐藏，不得进行多次跳转。首页图片与文字有互相重叠。存在虚拟物品在线交易， ios系统需要走IAP,小程序暂不支付，请留意后续。必须登录才能使用的服务，请提供测试账号。小程序的页面内容中，存在诱导类行为，包括但不限于诱导分享、诱导添加、诱导关注公众号、诱导下载等，要求用户分享、添加、关注或下载后才可操作的程序，含有明示或暗示用户分享的文案、图片、按钮、浮层、弹窗等的小程序，通过利益诱惑诱导用户分享、传播的小程序，用夸张言语来胁迫、引诱用户分享的小程序，强制或诱导用户添加小程序的，都将会被拒绝。

官方给出的常见拒绝情形

4. 附加

4.1 配置服务器域名

进入小程序后台管理系统，点击左边的开发—>开发设置—>服务器域名，然后点击修改，就可以配置，如图：

新手一枚，不喜勿喷，如有错误，请留言指出 .---- -. -. . . . ( .’,----- - - ’ ’ _/ ;–:-\ -------------------- U__n^_’’[. |ooo__ | |!||!||!||!| | c(_ …(_ …(_ …( /,] | |||||||| | ,_’|,L______],|_____________________| /;(@)(@)==(@)(@) (o)(o) (o)^(o)–(o)(o) **