关键词搜索

源码搜索 ×
×

uniapp 开发基础环境搭建和配置

发布2022-01-03浏览1656次

详情内容

一、下载并安装开发工具
1. 官网下载

HBuilder X下载

2. 点击 DOWNLOAD

在这里插入图片描述

3. 版本选择

选择 App 开发版本
在这里插入图片描述
windows 版本下载完成之后会得到一个 zip 的压缩包文件,解压完成即可使用

二、安装 sass 依赖

因为我们的项目开发会使用 sass,所以需要为 HBuilder X 安装 sass 编译器

2.1. 打开 HBuilder X
2.2. 打开插件地址

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

2.3. 导入插件

点击【使用 HBuilderX 导入插件】
在这里插入图片描述

2.4. 在弹出框中点击

【打开 HBuilderX
在这里插入图片描述

2.5. 点击【是】

在这里插入图片描述

2.6. 下载状态

此时会在 HBuilderX 右下角,提示你【正在下载】
在这里插入图片描述

2.7. 等待完成即可

在这里插入图片描述

三、创建 uni-app 项目
3.1. 创建项目

在这里插入图片描述

  • 高版本选择页面
    在这里插入图片描述
  • 低版本选择页面
    在这里插入图片描述
    在这里插入图片描述
3.2. 项目目录介绍
├─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内置的常用样式变量

    相关技术文章

    点击QQ咨询
    开通会员
    返回顶部
    ×
    微信扫码支付
    微信扫码支付
    确定支付下载
    请使用微信描二维码支付
    ×

    提示信息

    ×

    选择支付方式

    • 微信支付
    • 支付宝付款
    确定支付下载