作者:陈业贵 华为云享专家 51cto(专家博主 明日之星 TOP红人) 阿里云专家博主

文章目录


前言

从零开始运行一个简单的uni-app小程序端

一、uniapp是什么?

是一个使用Vue.js开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、Web(响应式)、以及各种小程序、快应用等多个平台。

二、使用步骤

1.安装HBuilderX

https://www.dcloud.io/hbuilderx.html

全流程:安装uni-app(小程序端)_小程序

2.在HBuilderX插件市场里面注册邮箱激活邮箱。然后登陆

https://ext.dcloud.net.cn/?cat1=1&type=UpdatedDate

全流程:安装uni-app(小程序端)_小程序_02

3.下载sass/scss插件

https://ext.dcloud.net.cn/plugin?id=2046

全流程:安装uni-app(小程序端)_微信小程序_03

全流程:安装uni-app(小程序端)_uni-app_04

4.HBuilderX软件里面(文件—>新建–>项目—>)

全流程:安装uni-app(小程序端)_微信小程序_05

5在HBuilderX里面打开App.vue文件(这步是在第六步之前必须做的哦)

6.HBuilderX里面(工具---->设置----》运行配置---->)

全流程:安装uni-app(小程序端)_uni-app_06

7.在微信小程序中(设置—>安全设置—>)

全流程:安装uni-app(小程序端)_uni-app_07

7.在HBuilderX里面(工具—》设置—》运行配置—>)

全流程:安装uni-app(小程序端)_uni-app_08

8.截图:

全流程:安装uni-app(小程序端)_小程序_09

9。等待编译…(成功啦)

全流程:安装uni-app(小程序端)_微信小程序_10