uni-app开发(一):准备工作及环境配置

本文介绍了uni-app的准备工作,包括下载Hbuilder开发工具和安装必要插件。接着,详细讲解了如何创建uni-app项目,解析了项目框架结构。此外,还涵盖了真机调试步骤,特别是Android设备的配置。最后,文章提到了uni-app中样式库的引用,如官方css样式库、自定义图标库、css动画库的引入和全局属性设置。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

一、准备工作

1、uni-app开发官网下载Hbuilder开发工具,直接下载解压缩就可以用了
https://uniapp.dcloud.io/quickstart

2、HBuilder插件安装:工具——插件安装——APP真机运行/uni-app编译/stylelint/eslint-js/es6编译

二、创建uni-app项目

1、创建uni-app新项目并命名会生成一系列文件。
2、项目框架结构

3、pages.json
包含所有页面(pages)及全局样式(globalStyle)

4、manifest.json
可视化界面设置

5、vue文件格式template(只包含一个view)
script
style

三、真机调试

1、Android机
打开手机开发者模式及USB调试——运行——运行到手机或模拟器

四、样式库的引用

4.1 引入官方css样式库
复制Hello uni-app项目中common/uni.css文件到自己项目中(创建同样的文件路径),并在App…vue文件中的style标签下添加 @import ‘./common/uni.css’;

4.2 引入自定义图标库
阿里巴巴矢量图标库——下载图标资源并将iconfont.css文件复制到common目录下࿰

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值