admin/nanocode
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
32289a0f3055941bab237ef66d4db600ac4c28ab
nanocode/wanandroid/uniapp/HBUILDER_PACKAGE_GUIDE.md
T
Ubuntu 32b43f85bd a
2026-07-03 16:58:28 +08:00

4.9 KiB
Raw Blame History

HBuilder X 打包指南

项目概述

这是一个基于Uniapp框架开发的玩Android客户端应用，已经完成了首页所有功能和底部导航。

打包步骤

第一步：准备环境

  1. 下载HBuilder X

  2. 安装HBuilder X

    • 解压下载的文件
    • 运行 HBuilderX.exe（Windows）或 HBuilderX.app（Mac）

第二步：导入项目

  1. 打开HBuilder X

  2. 导入项目

    • 点击菜单：文件 → 导入 → 从本地目录导入
    • 选择项目目录：/home/ubuntu/wanandroid/uniapp/
    • 点击"选择文件夹"

  3. 验证项目结构

    • 项目应显示在左侧项目管理器中
    • 主要文件：
      • manifest.json - 应用配置
      • pages.json - 页面配置
      • App.vue - 应用入口
      • pages/ - 页面目录
      • components/ - 组件目录

第三步：运行测试

  1. 运行到浏览器

    • 右键点击项目根目录
    • 选择"运行" → "运行到浏览器" → "Chrome"
    • 或按快捷键 Ctrl+R

  2. 测试功能

    • 检查底部导航是否正常
    • 测试首页Banner轮播
    • 测试文章列表加载
    • 测试下拉刷新和上拉加载
    • 测试页面切换

  3. 调试工具

    • 按F12打开开发者工具
    • 切换到移动端模拟模式
    • 检查网络请求和Console输出

第四步：打包为APK

  1. 配置manifest.json

    • 双击打开 manifest.json
    • 检查基本配置：
      • 应用名称：玩Android
      • AppID：__UNI__WANANDROID
      • 版本号：1.0.0

  2. 云打包（推荐）

    • 右键点击项目根目录
    • 选择"发行" → "原生App-云打包"
    • 配置选项：
      • 打包平台：Android
      • 包名：com.wanandroid.app（可自定义）
      • 证书：使用公共测试证书（或自有证书）
      • 其他选项保持默认
    • 点击"打包"

  3. 本地打包（高级）

    • 需要安装Android Studio和SDK
    • 配置更复杂，不推荐新手使用

第五步：安装测试

  1. 下载APK

    • 云打包完成后，下载生成的APK文件
    • 文件通常命名为：uniapp__WANANDROID.apk

  2. 安装到手机

    • 将APK文件传输到Android手机
    • 在手机上点击安装
    • 可能需要开启"允许安装未知来源应用"

  3. 功能测试

    • 测试所有页面切换
    • 测试网络请求
    • 测试交互功能

常见问题

1. 运行到浏览器空白页

  • 原因: 路径配置错误
  • 解决: 检查 pages.json 中的页面路径

2. 网络请求失败

  • 原因: 跨域问题或API不可用
  • 解决:
    • 检查API地址：https://www.wanandroid.com
    • 在HBuilder X中配置合法域名

3. 图标不显示

  • 原因: 图标路径错误
  • 解决: 检查 pages.json 中的图标路径

4. 打包失败

  • 原因: 证书问题或配置错误
  • 解决:
    • 使用公共测试证书
    • 检查manifest.json配置
    • 查看打包日志中的具体错误

5. 应用闪退

  • 原因: 权限问题或代码错误
  • 解决:
    • 检查Android权限配置
    • 查看手机Logcat日志
    • 在HBuilder X中调试

项目文件说明

核心文件

  • manifest.json - 应用配置文件
  • pages.json - 页面路由和导航配置
  • App.vue - 应用入口和全局样式

页面文件

  • pages/index/index.vue - 首页（已完成）
  • pages/project/project.vue - 项目页（占位）
  • pages/wxarticle/wxarticle.vue - 公众号页（占位）
  • pages/tree/tree.vue - 体系页（占位）
  • pages/mine/mine.vue - 我的页（占位）

组件文件

  • components/uni-load-more.vue - 加载更多组件

资源文件

  • static/images/icons/ - 底部导航图标
  • static/ - 其他静态资源

开发建议

后续开发步骤

  1. 实现WebView文章详情页
  2. 实现搜索功能
  3. 实现登录和用户系统
  4. 实现收藏功能
  5. 完善其他页面内容

性能优化

  1. 图片懒加载
  2. 数据缓存
  3. 请求节流
  4. 代码分包

代码规范

  1. 使用ES6+语法
  2. 组件化开发
  3. 统一的错误处理
  4. 添加注释和文档

技术支持

文档资源

社区支持

版本信息

v1.0.0 (2026-03-17)

  • 初始版本发布
  • 实现底部导航
  • 完成首页所有功能
  • 集成玩Android API
  • 生成可打包的Uniapp项目

系统要求

  • HBuilder X: 3.0+
  • Node.js: 12.0+（可选）
  • Android: 5.0+（API 21+）

提示: 首次打包建议使用云打包和公共测试证书。正式发布时需要申请自有证书和签名。

打包成功标志: 生成APK文件，可在Android手机上安装运行，首页功能正常。

Reference in New Issue View Git Blame Copy Permalink