uni-app项目的创建与不同环境下的运行注意点

1、创建uni-app项目

可以使用可视化的工具(HBuilder X)或者使用Vue脚手架去搭建项目，HBuilder X配备了内置环境，开箱即用。

HBuilder X从v3.2.5开始优化了对Vue3的支持，Vue3中的setup语法糖也支持使用。HBuilderX-高效极客技巧 (dcloud.io)

图1

2、运行uni-app项目在H5环境下

直接在HBuilder X通过运行至浏览器端，HBuilder X会自动的下载需要的一些插件。

3、运行uni-app项目在微信小程序环境下

HBuilder X可以注册一个Dcloud的开发者账号(有一些插件就需要拥有开发者账号才允许去下载使用)
HBuilder X支持在多端运行调试，需要注意的是，如果是要在小程序里面运行，微信开发者工具需要开启服务端口：小程序开发设置 -> 安全设置

图2
image.png

然后放开服务端口，如果HBuilder X运行至小程序端，小程序未被自动调起，则还需要配置微信小程序的路径。

图3.png

如果运行小程序还是未被调起，则可手动执行项目在微信小程序工具中跑

图4
图5

4、运行uni-app项目在真机/模拟器环境下

模拟器的话本人使用的是android studio下的模拟器(可以手动的配置模拟器)，MAC系统推荐使用XCode。

图6