查看了很多网上写的改来改去都在手机上运行不起来,运行起来又是白屏;最后放弃,自己结合文档搞吧!
1.
项目目录下的config
文件夹里的index.js
文件中,将build
对象下的assetsPublicPath
中的“/”
,改为“./”后,打包生成的 dist 文件。
注释:config
文件夹里的index.js中有两个assetsPublicPath,记住是改 build对象下的 assetsPublicPath
完了之后,打包, 执行npm run build之后生成dist文件夹
2.
在新建一个独立文件夹的项目 ,选择 H5+app
把新建H5+app里面不要的css,img,js,index文件先删除掉,然后把vue打包生成的 dist 文件夹里面的 static文件复制到 H5+app里面
上图中添加位置的代码
"statusbar": { //应用可视区域到系统状态栏下透明显示效果
"immersed": true
},
解决打包成App后,单击 手机返回键退出应用的bug。(可以直接把这段代码放到你vue项目中,重新打包,再放回来,也可以直接修改这个index.html)
<script>
document.addEventListener('plusready', function(a) { //等待plus ready后再调用5+ API:
//// 在这里调用5+ API
var first = null;
plus.key.addEventListener('backbutton', function() { //监听返回键
//首次按键,提示‘再按一次退出应用’
if (!first) {
first = new Date().getTime(); //获取第一次点击的时间戳
// console.log('再按一次退出应用');//用自定义toast提示最好
// toast('双击返回键退出应用'); //调用自己写的吐丝提示 函数
plus.nativeUI.toast("双击退出", {duration:'short'}); //通过H5+ API 调用Android 上的toast 提示框
setTimeout(function() {
first = null;
}, 1000);
} else {
if (new Date().getTime() - first < 1000) { //获取第二次点击的时间戳, 两次之差 小于 1000ms 说明1s点击了两次,
plus.runtime.quit(); //退出应用
}
}
}, false);
});
</script>
vue+hbuilder 打包成移动app的更多相关文章
-
关于vue2.0+hbuilder打包移动端app之后空白页面的解决方案
楼主是使用vue-cli构建的页面,代码是vscode,然后使用hbuilder打包成移动端的安装包.首先确认在npm run build 之后没有问题(默认dist文件夹),可以使用anywhere ...
-
项目打包成手机app 通过什么打包?
项目打包成手机app 通过什么打包? 1.HbuildX注册邮箱账号 2.新建-app,然后将自动生成的除manifest.json之外的所有文件删除,然后将vue项目build之后生成的dist文 ...
-
把H5打包成IOS APP其实可以很简单!签名?越狱?都不需要!
很多小伙伴都在开发自己的app, 有的实现实现比较简单,就是一个h5页面,然后想要打包成app发布出去. 这个想法很单纯 打包生成个app这个是很简单的,网上一堆打包工具,分分钟可以完成 BUT…… ...
-
利用HBuilder将vue项目打包成移动端app
事先准备,开发完成的web app项目(也可以利用vue-cli脚手架构建vue模板项目),npm run dev可以正常预览的项目 1,将项目目录下config文件内index.js中assetsP ...
-
VUE项目用hbuilder 打包为手机APP
一.测试项目是否可以正确运行 指令:npm run dev 首先我们先建立一个vue的项目,本人用的是vue-cli随便建立的,然后运行项目 不必非得是像我这样的,这一步的目的只是测试一下咱们的 ...
-
cordova+vue 项目打包成Android(apk)应用
现在使用vue开发的项目越来越多,使用vue开发的移动端打包就成了最大的问题.现在前端打包方案有好多种,但是综合来说,我比较喜欢用cordova来进行Android和ios的打包,配置完成之后,每次只 ...
-
vue2.0+mintui+hbuilder 打包移动端app之后出现空白页面的解决方案
1.首先使用的是vue-cli构建的页面,用hbuildX打包成移动端的安装包(hbuildX打包成app的流程,请看自行搜索) 2.cnpm install build 生成dist文件夹,里面包含 ...
-
前端如何将H5页面打包成本地app?
大家都知道H5页面怎么在手机浏览器里测试,但是如何能打包成APP测试呢?因为本人的手机是IOS系统,如果用Xcode打包需要开发证书,貌似99美元一年.意外发现一个叫Hbuild的软件,简单好用,下面 ...
-
将python代码打包成一个app/exe
前言 打包的代码通常都需要写一个简单的界面,一般用PyQt来写.用PyQt写界面的方法请戳这里:PyQt5的安装及基本配置 PyQt5教程 python提供了几个用来打包的模块,主要有py2ap ...
随机推荐
-
转:openwrt中luci学习笔记
原文地址:openwrt中luci学习笔记 最近在学习OpenWrt,需要在OpenWrt的WEB界面增加内容,本文将讲述修改OpenWrt的过程和其中遇到的问题. 一.WEB界面开发 ...
-
springMVC整合spring和hibernate4(适合于框架的搭建)
基础的东西不再详细说明,只在这里说明一下主要的配置文件,如何通过配置文件取得sessionFactory . 步骤: 1:在web.xml中引入springmvc的配置文件springmvc.xml( ...
-
JQuery focus()
跳转到登陆页面时可以使用focus方法 <input name="login_account"id="login_account"class=" ...
-
从51跳新唐cortex学习3——细说新唐两种定时器
的定时器我们已经是相当熟悉啦.但是,对于第一次接触新唐,第一次接触cortex的定时器一样,都是加1计数,但是功能和容量变大了),包括4个32位定时器(里面放24位的数据),还有分频功能.TMER0到 ...
-
linux中open函数使用
open函数用来打开一个设备,他返回的是一个整型变量,如果这个值等于-1,说明打开文件出现错误,如果为大于0的值 参考格式 if(fd=open("/dev/ttys0",O_RD ...
-
1.5、CDH 搭建Hadoop在安装之前(定制安装解决方案)
Cloudera托管两种类型的软件存储库,您可以使用它们来安装诸如Cloudera Manager或CDH-parcel存储库和软件包存储库之类的产品. 在大多数情况下,这些存储库是有效的解决方案,但 ...
-
ASP.NET MVC高亮显示当前页面菜单
1.创建MvcHtmlExtension扩展类 public static class MvcHtmlExtension { public static MvcHtmlString MenuLink( ...
-
Java进程线程理解
一个进程包括由操作系统分配的内存空间,包含一个或多个线程.一个线程不能独立的存在,它必须是进程的一部分.一个进程一直运行,直到所有的非守护线程都结束运行后才能结束. 多线程能满足程序员编写高效率的程序 ...
-
pyhont备份php代码脚本
#!/usr/bin/env python # encoding: utf-8 import time import os import sys import logging #create logg ...
-
Python初学总结
下边的总结都是在python3上 一.基础 1.输出与输入: 输出:print(变量/字符串) 输入:input() 返回的是字符串 price=input() print(price) 2.pyth ...