uni-app项目创建及打包APP(直接用HBX创建和打包)
概述
在完成项目开发后,接下来的关键步骤是进行多端发布。本文将介绍如何将uni-app项目发布为微信小程序、H5页面以及打包成安卓APP。
小程序发布
首先,你需要访问微信小程序官网并注册账号,申请一个小程序。登录小程序管理后台,在“开发”->“开发设置”中获取小程序AppID。
接着,在HBuilder X中打开项目的 manifest.json 配置文件,在“微信小程序配置”部分填入获取到的AppID。
若需上线,必须将API请求地址更换为正式的服务器域名。你需要修改项目中的网络请求配置文件(例如 utils/api.ts),将 config.baseURL 的值改为生产环境的地址。此外,还需将静态资源如字体文件的引用路径改为公网可访问的地址。
配置完成后,在微信小程序管理后台的“开发”->“开发设置”->“服务器域名”中,添加你的正式业务域名。
最后,打开微信开发者工具,导入项目并点击“上传”按钮,将代码提交至小程序后台。上传后,在后台提交审核,等待审核通过即可发布。
H5发布
在HBuilder X编辑器中,点击顶部菜单栏的“发行”,选择“网站-H5手机版”。在弹出的窗口中,填写你的网站标题,然后点击“发行”按钮。
编译过程可能需要几分钟,成功后控制台会输出编译成功信息,并提示已导出的H5资源目录。请注意,这些文件需要部署到Web服务器(如Nginx、Apache)才能正常访问,不能直接双击HTML文件打开。
为了在本地快速预览H5效果,可以使用 live-server 工具。这是一个轻量级的本地开发服务器工具,支持热更新。通过npm全局安装:npm install -g live-server。安装后,进入H5资源的导出目录,执行 live-server --port=9527 命令,即可在浏览器中通过 http://127.0.0.1:9527 访问你的H5项目,并可切换至浏览器开发者工具的移动设备模拟模式进行调试。
安卓打包
首先,在HBuilder X中编辑 manifest.json 文件。在“基础配置”中,设置应用名称、版本号等。其中的“uni-app应用标识”需要登录DCloud官网账号后在开发者中心生成。
然后,切换到“App图标配置”标签页,可以设置应用的启动图标。在“模块权限配置”中,根据应用需求勾选所需模块(如地图、支付等)。在“App SDK配置”中,可以选择需要打包支持的CPU类型(通常选择armeabi-v7a和arm64-v8a即可覆盖绝大多数设备)。
准备工作就绪后,点击顶部菜单栏的“发行”,选择“原生App-云打包”。在打包界面,勾选“Android”平台。如果是生产环境,建议使用自有证书进行签名打包,以提高应用安全性。若暂无证书,可暂时使用“使用DCloud公用证书”进行测试。点击“打包”按钮后,HBuilder X会将项目提交到DCloud的云端进行编译。
等待一段时间后,控制台会提示打包完成,并提供APK文件的下载链接。下载生成的APK文件,在真机上安装并测试运行是否正常。