移动端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

修改接口地址

接口地址位于/common/config.js中,用于配置开发和生产环境的接口地址

let urls = {
	api: '',
	socket: ''
}
if (process.env.NODE_ENV === 'development') {
	// 开发环境
	urls.api = 'http://localhost:8101'
	urls.socket = 'ws://localhost:8101'
} else {
	// 生产接口地址,同域部署可以留空
	urls.api = 'https://exam.yfhl.com'
	urls.socket = 'wss://exam.yfhl.com'
}
export default urls

同域部署,如本文档的同域发布方式,可以留空

    // 留空
    urls.api = ''
    urls.socket = ''

需要发布小程序,必须填写完整的域名,且必须是https协议

    // 生产接口地址,同域部署可以留空
    urls.api = 'https://exam.yfhl.com'
    urls.socket = 'wss://exam.yfhl.com'

说明:socket协议,http对应ws,https对应wss

运行项目

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

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

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

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

Last Updated:
Contributors: 沉醉寒风