一、下载并安装开发工具
uniapp的开发工具为HbuilderX,下载地址为:去下载
这里选择windows版本。windows 版本下载完成之后会得到一个 zip 的压缩包文件,解压完成即可使用,是不需要安装的绿色版本。
二、安装sass和scss插件
打开HbuilderX,点击工具----插件安装,如图所示:
在下一个界面选择前往插件市场,如图:
在插件市场找到scss/sass点击下载,如图:
在右侧点击,使用HbuilderX导入插件即可。此时会在 HBuilderX 右下角,提示你【正在下载】
等待完成即可
三、创建 uni-app 项目
创建项目,如图:
高版本选择页面
低版本选择页面
建立项目后如图:
四、项目目录介绍
├─pages // 页面存放文件夹,等同于 微信小程序中的 pages
│ └─index // 默认生成的页面
├─static // 静态资源存放文件夹
└─uni_modules // uni-app组件目录
│ └─uni-xxx // uni-app 所提供的业务组件,等同于 微信小程序中的组件
├─App.vue // 应用配置文件,用来配置全局样式、生命周期函数等,等同于 微信小程序中的app.js
└─main.js // 项目入口文件
├─mainfest.json // 配置应用名称、appid、logo、版本等打包信息,
└─pages.json // 配置页面路径、窗口样式、tabBar 等页面类信息,等同于 微信小程序中的app.json
└─uni.scss // uni-app内置的常用样式变量
uniapp开发环境搭建
最新推荐文章于 2024-07-19 17:05:06 发布