记录下自己VUE项目用Hbuider打包后启动白屏问题
刚用VUE做项目,之前测试时vue创建的自身项目打包都是启动OK没问题。今天打包自己的时,启动一直白屏。折磨了好久,百度了一堆。终于找到了方法。
首先是在config/index.js里面
build: {
// Template for index.html
index: path.resolve(__dirname, '../dist/index.html'),
// Paths
assetsRoot: path.resolve(__dirname, '../dist'),
assetsSubDirectory: 'static',
assetsPublicPath: './',
/**
* Source Maps
*/
productionSourceMap: true,
devtool: '#source-map',
productionGzip: false,
productionGzipExtensions: ['js', 'css'],
bundleAnalyzerReport: process.env.npm_config_report
}
assetsPublicPath我确实也改为了相对路径"./",
然后在自己配置路由里面。
const router = new VueRouter({
mode: "history",//这个有问题,要改为hash
routes: routers
});
网上说mode不能为history。
百度了下这两个区别,
history: 依赖 HTML5 History API 和服务器配置。
hash: 使用 URL hash 值来作路由。支持所有浏览器,包括不支持 HTML5 History Api 的浏览器。
两个在PC上运行时没什么 区别,但是改为hash后打包后就可以了,没白屏了。
记录下自己VUE项目用Hbuider打包后启动白屏问题的更多相关文章
- Vue项目用webpack打包后,预览时资源路径出错(文末有vue项目链接分享)
最近用vue写了一些项目,项目写完之后需要打包之后才能放到网上展示,所以在这里记录一下项目打包的过程以及遇到的一些问题. --------------------------------------- ...
- Vue项目开发之打包后背景图片路径错误的坑
在开发vue项目的过程中,使用浏览器进行预览的时候所有图片的路径是没有任何问题的,但是在打包后传到服务器上,在微信端查看背景图片时,background的图片竟然不显示,img标签里的图片却是正常展示 ...
- vue项目使用hbuilder打包后,真机测试白屏
在命令行直接运行 npm run build后,生成的dist文件中,直接打开index.html文件 Tip: built files are meant to be served over an ...
- 记录下hbuilder vue项目打包APP 在IOS上点击延迟的问题
做的项目打包成APP在IOS 上有延迟问题,在安卓下却不会,联想到之前 用IONIC时打包的APP也是 在IOS下有300毫秒延迟问题.所以 只能 认吧. 安装fastclick 插件: npm in ...
- Vue项目创建build打包后可修改的配置文件
需要一个配置文件,能在项目打包(build)时不被打包,方便修改,同时项目刷新时读取改配置. 实现方法如下: 1.在项目的static目录下创建project.config.json文件(名称随意,建 ...
- vue项目用webpack打包后跨域问题
在app.js的最开始加上 app.all('*', (req, res, next) => { res.header("Access-Control-Allow-Origin&quo ...
- vue项目在webpack打包后背景图片显示不了
加上 publicPath:'../../'即可
- (Android)react-native-splash-screen实践-解决react-native打包好后启动白屏的问题
1.安装 npm i react-native-splash-screen --save or yarn add react-native-splash-screen --save 2.自动配置 re ...
- 在vue项目npm run build后,index.html中引入css和js 报MIME type问题
问题: 1.在vue项目中,build打包后,index页面打开会报错, MIME type ('text/html') ;报错内容:because its MIME type ('text/html ...
随机推荐
- mvc partialView+kendo window
在写mvc项目时,一个列表查询页面含有多个操作按钮及弹框操作.原本写在了一个view中,导致代码繁多复杂,难以维护,还有表单赋值清空.验证等麻烦. 因此改用kendo window +partialV ...
- 【函数参数】什么是*args和**kwargs?
**args表示任何多个无名参数,它是一个tuple,Python将**args从开始到结束作为一个tuple传入函数 **kwargs表示关键字参数,它是一个dict,Python将**kwargs ...
- IT题库3-线程实现的方式
1.继承Thread类创建线程 Thread类本质上是实现了Runnable接口的一个实例,代表一个线程的实例.启动线程的唯一方法就是通过Thread类的start()实例方法.start()方法是一 ...
- 微信扫描二维码安卓弹出默认浏览器(苹果打开App Store)打开下载链接
使用微信推广的用户经常都会遇到推广链接被拦截导致无法下载app的情况,此时用户在微信中打开会提示“ 已停止访问该网页 ”.这对于使用微信营销的商家来说就很不友好且损失非常大,因为用户是不知道为什么打不 ...
- Recycle----项目总结
github项目地址:https://github.com/HuChengLing/recycle 软件规模: 我们这个Recycle app属于一个小型项目,整体规模不大.预期有垃圾回收和二手品交易 ...
- Vim搜索、取消高亮、显示行数、取消行数
1.显示行数 :set nu 2.取消行号 :set nu! 3.高亮搜索 /target 4.取消高亮 :noh
- python接口自动化-接口重定向和编码格式
1.如果测试的接口重定向,那么只需添加allow_redirects=False禁止重定向就可: 2.如果请求的结果,中文出现没有解码 \xe9\x83\xad\xe7\xbf\xa0\xe6\x99 ...
- vue配置404页面
{ path:'*', name:"/404", component:cuowu } path星号表示没有这个路由 name表示去这个地址 component这个页面引入的时候叫的 ...
- 记python使用grpc
using grpc in Python gRPC是基于http/2的RPC框架,使用ProtoBuf作为底层数据序列化.Nginx服务器2018年3月17日引入gRPC支持. gRPC 是用来实现跨 ...
- 【新特性】JDK1.9
一.目录结构 JDK9具体目录结构如下所示: bin: 该目录包含所有的命令. conf: 包含用户可以编辑的配置文件,例如以前位于jre\lib 目录中的.properties 和 .policy ...