uni-app开发之创建一个app项目

简介: uni-app开发之创建一个app项目

写在前面


今天开始学习使用uni-app框架,来开发一个简单的app项目。


uni-app采用了vue来进行编写,我们也是要跟着学习一些vue3的一系列语法。


部署环境


让我们先下载一个uni-app的开发工具,那就是HBuilderX,可以开箱即用,无须配置其他环境,比如node.js。


如果你也需要下载,那么请去官网上下载最新版,国内开发的IDE,问题及国内的更新还是比较及时的。


开始创建一个uni-app项目


打开HBuilderX开发工具,选择文件——新建项目,到达如下界面:

image.png

当前是可以选择模板的,HBuilderX提供了几个很方便的模板:


默认模板:自然就什么都没有了

Hello uni-app:这个模板中具有着uni-app框架的一些组件、接口、模板等功能。称得上是uni-app的入门示例。


Hello uni-Cloud:此模板中集成了Cloud云服务的一些基本操作。


uniStarter:如果你用过springboot-start的话,那这个就好理解了,快速开发模板。


uni-ui库:此模板中具有uni提供的一系列的ui组件库,也是我们之后要一点点的学习的任务。


还有很多的模板,我记得一开始没几个模板,最近猛然发现更新了好多有意思的模板。


今天我们就先选择uni-ui模板来初始化一个Demo项目。


创建成功后,如下图目录:

image.png

随后让我们通过Chrome浏览器来运行,点击运行——浏览器——Chrome。

image.png

不过这里建议大家不要使用浏览器去调试,最好是有个真机去调试,效果会直接展示出来的。


相关文章
|
30天前
|
小程序 JavaScript 前端开发
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
504 1
|
16天前
|
小程序 数据挖掘 UED
开发1个上门家政小程序APP系统,都有哪些功能?
在快节奏的现代生活中,家政服务已成为许多家庭的必需品。针对传统家政服务存在的问题,如服务质量不稳定、价格不透明等,我们历时两年开发了一套全新的上门家政系统。该系统通过完善信用体系、提供奖励机制、优化复购体验、多渠道推广和多样化盈利模式,解决了私单、复购、推广和盈利四大痛点,全面提升了服务质量和用户体验,旨在成为家政行业的领导者。
|
13天前
|
机器人
布谷直播App系统源码开发之后台管理功能详解
直播系统开发搭建管理后台功能详解!
|
22天前
|
NoSQL PHP Redis
布谷语音app源码服务器环境配置及技术开发语言
布谷语音app源码服务器环境配置及技术语言研发。。
|
Web App开发 关系型数据库
pc/app 项目/功能设计
2015-08-11 15:29:59 首先, 提供服务的整个系统包含哪几个设备 用户->[PC浏览器|APP|APP浏览器]->web服务器->[PHP/JAVA组件]->[MySQL/Redis]->[云服务/本地物理集群] 第一功能的使用目标, 是PC还是APP 第二信息交流格式, j...
864 0
|
30天前
|
JSON 小程序 JavaScript
uni-app开发微信小程序的报错[渲染层错误]排查及解决
uni-app开发微信小程序的报错[渲染层错误]排查及解决
452 7
|
1月前
|
JavaScript 前端开发 小程序
uniapp一个人开发APP关键步骤和考虑因素
uniapp一个人开发APP关键步骤和考虑因素
121 1
uniapp一个人开发APP关键步骤和考虑因素
|
30天前
|
JavaScript 前端开发 UED
Vue与uni-app开发中通过@font-face巧妙引入自定义字体
Vue与uni-app开发中通过@font-face巧妙引入自定义字体
70 9
|
1月前
|
缓存 小程序 索引
uni-app开发微信小程序时vant组件van-tabs的使用陷阱及解决方案
uni-app开发微信小程序时vant组件van-tabs的使用陷阱及解决方案
177 1
|
1月前
|
小程序 JavaScript API
微信小程序开发之:保存图片到手机,使用uni-app 开发小程序;还有微信原生保存图片到手机
这篇文章介绍了如何在uni-app和微信小程序中实现将图片保存到用户手机相册的功能。
526 0
微信小程序开发之:保存图片到手机,使用uni-app 开发小程序;还有微信原生保存图片到手机

热门文章

最新文章