楼主是使用vue-cli构建的页面,代码是vscode,然后使用hbuilder打包成移动端的安装包。首先确认在npm run build 之后没有问题(默认dist文件夹),可以使用anywhere开一个服务器看看。

在确保咩有问题的情况下,将dist文件夹直接拖进 hbuilder (hbuilder下载地址)中,

,在dist上面右击,点击 转换成移动app,dist的图标会由 W 变成 A,如图:

,dist文件夹中会新增manifest.json(这个是app的配置文件,修改app图标等,双击可以进入修改界面(参考文档)),如图:

,点击 index.html,运行,浏览器运行,如图

,点击之后空白(楼主用的是chrome),但是加载没有问题,

解决方案有:

1、在build下的配置路径出了问题

   修改assetsPublicPath为: './ '

2、由于hbuilder的默认格式,路由不能使用history模式

   将mode:‘history’ 注释即可

关于vue2.0+hbuilder打包移动端app之后空白页面的解决方案的更多相关文章

  1. vue2.0+mintui+hbuilder 打包移动端app之后出现空白页面的解决方案

    1.首先使用的是vue-cli构建的页面,用hbuildX打包成移动端的安装包(hbuildX打包成app的流程,请看自行搜索) 2.cnpm install build 生成dist文件夹,里面包含 ...

  2. HBuilder打包vue项目app后空白,并请求不到数据

    (解决空白问题)在打包之前一定要修改 config 目录下的 index.js 文件中的 bulid 模块打包配置项,否则会出现空白,如图   修改前 assetsPublicPath= '/',. ...

  3. 基于vue2.0的一个豆瓣电影App

    1.搭建项目框架 使用vue-cli 没安装的需要先安装 npm intall -g vue-cli 使用vue-cli生成项目框架 vue init webpack-simple vue-movie ...

  4. Android通过Chrome Inspect调试WebView的H5 App出现空白页面的解决方法(不需要FQ)

    本文系博主原创,未经许可不得转载.如未经本人同意,私自转载或盗取资源提供下载,本人保留追究其法律责任的权利. 调试基于WebView的Hybrid App最舒服的工具当然是Chrome自带的开发者工具 ...

  5. VUE项目用hbuilder 打包为手机APP

    一.测试项目是否可以正确运行    指令:npm run dev 首先我们先建立一个vue的项目,本人用的是vue-cli随便建立的,然后运行项目 不必非得是像我这样的,这一步的目的只是测试一下咱们的 ...

  6. vue+hbuilder 打包成移动app

    查看了很多网上写的改来改去都在手机上运行不起来,运行起来又是白屏:最后放弃,自己结合文档搞吧! 1. 项目目录下的config文件夹里的index.js文件中,将build对象下的assetsPubl ...

  7. Vue2.0项目打包后只能访问首页,其他页面路径错误找不到

    原因是你使用了vue-router的history,可以尝试去掉  // mode:"history",

  8. HBuilder 做移动端app流程

    1.新建一个移动项目 2.编写代码 3.发行-发行为原生安装包,配置参数 选择icon 和引导页

  9. 报表移动端app如何实现页面自适应?

    1. 描述 PC上制作好的报表,在手机端查看的时候,报表软件默认的自适应效果不尽人如意.例如,报表比较大,到手机上被缩的非常小,字都看不清等等.为此FineReport增加了选项可以手动控制报表在移动 ...

随机推荐

  1. mysql 主从库同步

    #主库修改my.ini [mysqld] server log-bin=mysql-bin binlog-do-db=demo #从库修改my.ini [mysqld] server replicat ...

  2. SQL: Cannot create JDBC driver of class '' for connect URL

    使用数据库数据源的web 项目,发布后,访问数据库500报错: 浏览器端: 控制台: 数据库连接池在不启动Tomcat的情况下,测试类通过,没有问题. 一旦在服务器发布,就会出现问题,考虑是Tomca ...

  3. ThinkPhp5 出现访问出现 No input file specified. 问题

    今天复习一下ThinkPhp5,在官网下载了核心版,windows下配置了虚拟域名之后出现了神奇的现象 如下图 直接访问域名能访问到index模块下的index控制器下的index方法 但是我输入完整 ...

  4. php发送http put/patch/delete请求Demo

    CURL请求对于PHPer是必备技能,使用curl_opt函数来发送各式各样的http请求动作,不仅限于get和post.在测试自己的restful api的时候,通过访问这个代理发送http put ...

  5. 利用Python生成GIF动图

    一.PIL库 1.PIL库的概括: PIL(Python Image Library)是python的第三方图像处理库,但是由于其强大的功能与众多的使用人数,几乎已经被认为是python官方图像处理库 ...

  6. Js高级程序设计~读书笔记

    1.函数-函数声明和函数表达式 解析器在向执行环境加载数据时,函数声明和函数表达式的对待不同. 解析器会率先执行函数声明,将会在任何使用到它的地方前加载, 而对于函数表达式,只会在执行到的时候去加载: ...

  7. 《Linux就该这么学》第十三天课程

    使用Apache服务部署静态网站 原创地址:https://www.linuxprobe.com/chapter-10.html 今天学了Apache,这只是RHCE课程的开始,估计后面越来越难 今天 ...

  8. 2019.03.28 bzoj3326: [Scoi2013]数数(数位dp)

    传送门 题意: 一个人数数,规则如下: 确定数数的进制B 确定一个数数的区间[L, R] 对于[L, R] 间的每一个数,把该数视为一个字符串,列出该字符串的所有连续子串对应的B进制数的值. 对所有列 ...

  9. HDU 6348 序列计数 (树状数组 + DP)

    序列计数 Time Limit: 4500/4000 MS (Java/Others)    Memory Limit: 262144/262144 K (Java/Others)Total Subm ...

  10. Codeforces Codeforces Round #484 (Div. 2) E. Billiard

    Codeforces Codeforces Round #484 (Div. 2) E. Billiard 题目连接: http://codeforces.com/contest/982/proble ...