当前位置:   article > 正文

HBuilder X 集成vue项目到5+APP中,运行打包测试发布_hbuilder x 中的5+app 如何启动

hbuilder x 中的5+app 如何启动

1.以下内容借鉴自https://www.cnblogs.com/taohuaya/p/10263519.html

一:打包vue项目

二:在HBuilder X 点击新建,选择5+app项目,新建后把vue打包的项目dist下的

static和index.html 复制到新建的app项目下

三:manifest.json,项目配置

配置完成后点击运行,可以用模拟器运行,也可以手机

安卓安装一个360手机助手,连接手机,然后点击运行,选择运行手机或者模拟器,会看到手机型号,点击即可

苹果安装istule,连接手机,同上

测试完成后,选择发行,先使用云打包测试下,云打包只能下载五次,打包成功后会返回一个下载连接,在手机浏览器打开连接,进行下载,此过程苹果可能会失败

安卓端手机返回按键直接退出处理

  1. /**
  2. * 解决hbuilder打包app之后点击手机返回键直接退出app的
  3. */
  4. document.addEventListener('plusready', function () {
  5. var webview = plus.webview.currentWebview();
  6. webview.setBounce({position:{top:'100px'},changeoffset:{top:'0px'}});//设置Webview窗口的回弹效果
  7. var first = null;
  8. plus.key.addEventListener('backbutton', function () {
  9. webview.canBack(function (e) {
  10. if (e.canBack) {// 获取Webview窗口是否可后退 ,可后退时
  11. webview.back();
  12. } else {
  13. console.log("不可回退");
  14. // 处理逻辑:1秒内,连续两次按返回键,则退出应用;
  15. if (!first) {// first没有值时
  16. first = new Date().getTime();
  17. console.log('再按一次退出应用') // 此处可以用自定义提示
  18. toast({content:"再按一次退出应用",duration:1000});
  19. setTimeout(function () {
  20. first = null
  21. }, 1000)
  22. } else {
  23. if (new Date().getTime() - first < 1500) {
  24. plus.runtime.quit()
  25. }
  26. }
  27. }
  28. })
  29. })
  30. });

 

 

以下为摘抄内容怕以后不好找,

开始使用 HBuiderX 打包

 

 

 

 

 这是我vue 项目打包后的dist 文件。

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 设置沉浸状态栏:(什么是沉浸状态栏和设置方法 请移步: http://ask.dcloud.net.cn/article/32  地址里的  http://ask.dcloud.net.cn/article/1150)

 上图中添加位置的代码:

        "statusbar": { //应用可视区域到系统状态栏下透明显示效果
            "immersed": true
        },

 

 

 

 

 

 

 

 

 

 

 

 

 

 

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/不正经/article/detail/245548
推荐阅读
相关标签
  

闽ICP备14008679号