页面树结构
转至元数据结尾
转至元数据起始

一.下载Hbuilder 稳定版 APP开发版 并安装 下载地址:https://www.dcloud.io/hbuilderx.html

参考官方安装注意事项


二.安装成功后 注册hbuilderx用户


三. windows需额外下载360手机助手连接安卓手机  mac需确认系统iTunes版本可以正常连接自己ios手机;


四.clone DWF3.0代码到本地   注意:此处只是为了给测试人员本地真机测试 打包自己服务器环境的步骤 线上除了第三步路由的修改 还使用jekins脚本即可

  • 使用任一代码开发工具 打开DWF3.0项目;
  • 修改app-mobile工程下 public文件夹下 config.js文件内 下图圈中区域的服务器地址 为自己测试服务器地址;

      


  • 修改app-mobile工程下 src文件夹下 main.js文件内 下图圈中区域的路由模式 由 'history' 改为 'hash' 此处线上打包也需注意;

      


  • 修改app-mobile工程下 vue.config.js 下图圈中区域的公共路径 由'/app-mobile' 改为 './' 此处线上打包也需注意;

      


  • 确认完成上面两步修改后 任务管理器进入到克隆下来代码文件DWF3.0位置 执行以下两行命令完成打包操作;
  • cd app-mobile
  • npm install
  • npm run build

五.打包成功后 打开我们已经注册用户并为登录状态的HbuilderX;

  • 选择文件 => 新建 => 项目

      

  • 选择5+APP  => 填写APP英文名 => 选择默认模板 => 点击创建

      

  • 创建项目成功后 点击项目工程下manifest.json 基础配置下 确保应用标识获取到 应用名称可以和标识不同 但建议相同  版本名称 版本号参考截图 或自己定义有效值 首页地址按默认提供无需修改;

      

  • 选择模块配置 定位勾选百度定位 地图勾选百度地图  勾选视频播放  (地图配置秘钥 DpWBtMpHLbMNaCncXlGFciGOHQG1hLu8);

      

  • 选择权限配置  除去默认已勾选的配置 将含有camera  CAMERA  LOCATION  NETWORK  WIFI   VOICE  VOICEMAIL  AUDIO   VIDEO的权限进行勾选(太分散了 截不动图);
  • 选择源码视图  将以下配置加入plugins属性中;

      "audio": {
             "mp3": {
                    "description": "Android平台录音支持MP3格式文件"
             }
       }

       

六.Hbuilderx项目及基本配置准备好后 打开DWF3.0下 app-mobile下 的dist文件夹;

  • 将dist文件夹下的全部文件选中拷贝到HbuilderX 我们上面新建的dwfapp项目中 重复名的文件夹选择覆盖即可;
  • 打开拷贝过来的index.html 将文件内 '/app-mobile' 全部修改替换为 '.' 并保存;
  • 打开拷贝过来的index.html 将文件内所有静态资源引入地址前加上 './' 并保存;

      

  • 通过电脑连接数据线链接手机 安卓打开360手机助手 ios打开iTunes 在手机弹出usb调试弹窗后选择信任  (iOS系统手机在选择信任后 进入手机设置 => 通用 => 设备管理 => 对Digital Heaven企业级app选择信任);
  • HbuilderX选中我们的dwfapp项目 选择运行 => 运行到手机或模拟器 =>  运行设备xxx手机(若此处没有显示当前通过数据线链接的手机,请重新确认手机是否已对usb调试进行允许信任 可重复上一步操作);

      

  • 以上步骤都成功后 在hbuilderx的终端提示运行结束后 即可在手机看到HbuilderLogo图标的一个App 进入即可真机进行测试;

      

七.安卓系统apk打包 确保以上配置和index.html文件都正确修改;

  • 修改打包后app的图标 (无需修改APP图标的可忽略此步骤);

           点击项目工程下manifest.json 进入图标配置 点击浏览上传1024 * 1024的png格式图片 然后勾选上不替换手动设置的图标 点击自动生成所有图标并替换;

           

  •  点击发行 选择原生App-云打包 弹窗内点击右下角的打包按钮 初次云打包 会提示需要安装打包插件 使用公共证书 确认即可;

           

            打包命令执行成功 下方终端会有进度提示 请耐心等待 按照官方建议 一次打包没完成之前 不要反复打包;

  • 无标签