移动端UNI-APP开发

下载IDE

系统推荐使用的IDE为HBuilderX

https://www.dcloud.io/hbuilderx.htmlopen in new window

导入项目

HBuilderX > 文件 > 打开目录 > exam-xx-uni

编译项目

因为项目是基于vue构建,首次运行需要执行npm install 命令,否则会出现找不到包的情况

# 在exam-xx-uni根目录执行install命令
npm install

运行调试

修改接口地址,默认调试配置文件为项目根目录下的:.env.development

# 开发接口设置,设置为本地后端接口
VITE_API_BASE_URL = http://localhost:8101

打发行包

修改发行包配置文件.env.production,将接口地址修改为生产环境的接口地址

# 生产环境
VITE_API_BASE_URL = https://exam.yfhl.net

接口地址可以是完整的https://或http://开头的URL
也可以留空,留空则表示同域访问,需要使用nginx进行同域代理即可访问,本文中的部署则使用了此种方法,打包时接口地址留空
需要发布小程序,必须填写完整的域名,且必须是https协议

运行项目

修改好配置后,通过HBuilderX运行项目即可

# 以h5网页的方式运行
运行 > 运行到浏览器 > 选择一个浏览器

# 以小程序的方式运行
运行 > 运行到小程序模拟器 > 微信开发者工具

以微信小程序的方式运行时,实际上是先执行编译,编译成微信小程序识别的代码,然后调用微信开发者工具打开,所以要求电脑上必须安装微信开发者工具点击此处下载微信开发者工具open in new window

Last Updated:
Contributors: 沉醉寒风