最近要写毕业设计，要用到 uni-app （https://uniapp.dcloud.io/）进行开发。是一个使用 Vue.js开发所有前端应用的框架，编写一套代码，可发布到好几个平台。
在这我选择做一个外卖的微信小程序。
一、下载软件
首先先下载软件-Hbuildx，十分适合做uni-app。因为是做微信小程序，去官网下了一个微信开发者工具（https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html）。在此之前申请了微信小程序的AppId（https://mp.weixin.qq.com/）。
二、下载插件
image.png
吐槽一下：Hbuildx没有VsCode的好用。
三、创建项目
新建一个uniapp的项目。
image.png
查看文件结构：
image.png
uniapp 上很多东西和 vue都是连通的。
- pages.json数组中第一项表示应用启动页，还可以写底部的导航栏。
- uni.scss是uni-app内置的常用样式变量
- manifest.json是关于微信小程序的配置。
- App.vue和main.js就是大家很熟悉的东西。
- 一些具体的信息都写在pages文件。
- 图片等静态资源就在 static 文件里
- unpackage创建时候并没有，连上开发程序后自动生成。
四、建立组件
image.png
先把主页 订单 我的 三个基本文件写好。
接下来先从主页开始写起。
把主页分成五个组件，在index.js中配置。
image.png
五、搜索组件
先写一些定位 搜索的东西。
水平太差了，定位只能写静态地址。
下次再更新博客的时候，一定要学会使用高德地图定位。
image.png
今天就先到这了。
