前言
自 2017-1-9微信小程序诞生以来，历经几年的迭代升级，已有数百万小程序上线，成为继Web、iOS、Android之后，第四大主流开发技术。
小程序的出现极大地降低了个人开发者微创业的门槛，不需要后端技术，不需要服务器和域名这些乱七八糟的前置操作，只需要懂得前端技术，就能发布一款属于自己的轻量级应用，简直是前端开发者的福音呐，当然，如果是一些数据交互功能还是需要后端技术。
今天本文就讲讲小程序从注册到上线。
关于选型
根据自己的场景以及业务需求，进行选择开发框架，这里我个人比较喜欢用ununi-app，主要原因是因为他可以短端打包，一套代码可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。
uni-app在手，做啥都不愁。当然也可以原生。
废话不多说，开讲。
前期工作
注册，开发工具下载安装
微信注册，根据指引填写信息，这里要说明一下，注册个人或者公司的，注册类目要想清楚，要对自己的小程序有一个清晰定位，你的小程序是要干什么的，应用场景是啥。按照流程注册完成之后会得到一个appID，如图：
我这里平时开发使用的是
至此，前期工作已经准备差不多了，开干。
项目开发搭建
前面我们说到，我们技术选型使用uni-app,开发工具使用vs code
安装配置
- 全局安装vue-cli
npm install -g @vue/cli
- 使用正式版（对应HBuilderX最新正式版）
vue create -p dcloudio/uni-preset-vue my-project
此时，会提示选择项目模板（使用Vue3/Vite版不会提示，目前只支持创建默认模板），初次体验建议选择 hello uni-app 项目模板，如下所示：
然后按照提示继续操作，得到如下目录，当然有的目录文件是我自己根据业务需求新建的，
项目配置
- appid配置
这里把你上面申请注册的appid复制进去
- 路由配置
- App.vue
你的小程序需求项目具体代码代码写在pages文件下
运行项目
Project setup
yarn install
Compiles and hot-reloads for development
yarn serve
Compiles and minifies for production
yarn build
或
npm install
运行并发布 uni-app
npm run dev:mp-weixin
npm run build:mp-weixin
如果你的vs code插件安装的完整也可以直接，如图点击运行脚本
至此一个小程序，从申请到运行成功，就结束了，有什么问题可以留言提问
发布
使用微信开发者工具，导入刚刚打包好的文件，点击上传，即可
登陆微信小程序管理后台，在管理 - 版本管理，可以看到自己上传最新的版本代码，提交审核
最后就等着微信审核，审核成功发布即可。
说明
目录结构
一个uni-app工程，默认包含如下目录及文件：
┌─uniCloud 云空间目录，阿里云为uniCloud-aliyun,腾讯云为uniCloud-tcb（详见uniCloud）
│─components 符合vue组件规范的uni-app组件目录
│ └─comp-a.vue 可复用的a组件
├─hybrid App端存放本地html文件的目录，详见
├─platforms 存放各平台专用页面的目录，详见
├─pages 业务页面文件存放的目录
│ ├─index
│ │ └─index.vue index页面
│ └─list
│ └─list.vue list页面
├─static 存放应用引用的本地静态资源（如图片、视频等）的目录，注意： 静态资源只能存放于此
├─uni_modules 存放[uni_module](/uni_modules)规范的插件。
├─wxcomponents 存放小程序组件的目录，详见
├─main.js Vue初始化入口文件
├─App.vue 应用配置，用来配置App全局样式以及监听 应用生命周期
├─manifest.json 配置应用名称、appid、logo、版本等打包信息，详见
├─pages.json 配置页面路由、导航条、选项卡等页面类信息，详见
└─uni.scss 这里是uni-app内置的常用样式变量
上线小程序
这个是我本人上线且运行一段时间的微信小程序，欢迎大家指教说明
特别鸣谢 ❤️❤️❤️
喜欢别忘了分享、点赞、收藏，star哟～
