vue+webpack 打包文件 404 页面空白的解决方法


Posted in Javascript onFebruary 28, 2018

最近用vue-cli+vue-router+webpack建立项目,其中的遇到的三个问题,整理如下:

vue-cli+ webpack 建立的项目,cnpm run build 打包项目之后,需要放在http服务器上才可以运行,

例如 :nginx

vue单页面的启动页面是index.html,路由的路径实际是不存在的,所以会出现刷新页面404的问题,需要设置所有找不到的路径直接映射到index.html

1 刷新页面404

vue+webpack 打包文件 404 页面空白的解决方法

配置启动文件的index页面的路径root: D:/workPlace/mex-adx-web/mex-adx-web/dist

2 二级页面刷新报错:

打包的项目静态资源的路径需要设置为绝对路径。如果是相对路径会出错

config-index.js

vue+webpack 打包文件 404 页面空白的解决方法

3 :项目运行没有问题,但是打包之后运行文件报错

Unexpected token:`。。。

需要单独配置babel,将配置放到文件.babelrc中:

vue+webpack 打包文件 404 页面空白的解决方法

以上这篇vue+webpack 打包文件 404 页面空白的解决方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Extjs显示从数据库取出时间转换JSON后的出现问题
Nov 20 Javascript
使用JavaScript 实现各种跨域的方法
May 08 Javascript
JS实现日期加减的方法
Nov 29 Javascript
jQuery插件EnPlaceholder实现输入框提示文字
Jun 05 Javascript
jQuery插件之Tocify动态节点目录菜单生成器附源码下载
Jan 08 Javascript
以WordPress为例讲解jQuery美化页面Title的方法
May 23 Javascript
基于jPlayer三分屏的制作方法
Dec 21 Javascript
工作中常用的js、jquery自定义扩展函数代码片段汇总
Dec 22 Javascript
利用百度地图API获取当前位置信息的实例
Nov 06 Javascript
微信小程序实现下拉刷新动画
Jun 21 Javascript
Centos7 安装Node.js10以上版本的方法步骤
Oct 15 Javascript
VUE+elementui面包屑实现动态路由详解
Nov 04 Javascript
webpack项目调试以及独立打包配置文件的方法
Feb 28 #Javascript
vue-cli+webpack项目 修改项目名称的方法
Feb 28 #Javascript
vue 组件 全局注册和局部注册的实现
Feb 28 #Javascript
vue 自定义全局方法,在组件里面的使用介绍
Feb 28 #Javascript
Vue2.0子同级组件之间数据交互方法
Feb 28 #Javascript
bootstrap table支持高度百分比的实例代码
Feb 28 #Javascript
vue 2.x 中axios 封装的get 和post方法
Feb 28 #Javascript
You might like
PHP编码规范的深入探讨
2013/06/06 PHP
java微信开发之上传下载多媒体文件
2016/06/24 PHP
php实现的三个常用加密解密功能函数示例
2017/11/06 PHP
php实现socket推送技术的示例
2017/12/20 PHP
tp5框架内使用tp3.2分页的方法分析
2019/05/05 PHP
firefox下frameset取不到值的解决方法
2010/09/06 Javascript
js获取下拉列表的值和元素个数示例
2014/05/07 Javascript
js实现页面a向页面b传参的方法
2016/05/29 Javascript
jQuery双向列表选择器select版
2016/11/01 Javascript
jquery中封装函数传递当前元素的方法示例
2017/05/05 jQuery
详解微信第三方小程序代开发
2017/06/23 Javascript
Vue编写多地区选择组件
2017/08/21 Javascript
JS运动特效之任意值添加运动的方法分析
2018/01/24 Javascript
AngularJs的UI组件ui-Bootstrap之Tooltip和Popover
2018/07/13 Javascript
JavaScript作用域、闭包、对象与原型链概念及用法实例总结
2018/08/20 Javascript
详解Vue SSR( Vue2 + Koa2 + Webpack4)配置指南
2018/11/13 Javascript
使用flow来规范javascript的变量类型
2019/09/12 Javascript
vue2.x 对象劫持的原理实现
2020/04/19 Javascript
JavaScript对象访问器Getter及Setter原理解析
2020/12/08 Javascript
在Python中使用M2Crypto模块实现AES加密的教程
2015/04/08 Python
在Python中使用Neo4j数据库的教程
2015/04/16 Python
python基础入门学习笔记(Python环境搭建)
2016/01/13 Python
Django开发的简易留言板案例详解
2018/12/04 Python
python3 property装饰器实现原理与用法示例
2019/05/15 Python
python程序中的线程操作 concurrent模块使用详解
2019/09/23 Python
Python 实现数组相减示例
2019/12/27 Python
详解如何在PyCharm控制台中输出彩色文字和背景
2020/08/17 Python
python try...finally...的实现方法
2020/11/25 Python
MONNIER Frères英国官网:源自巴黎女士奢侈品配饰电商平台
2018/12/06 全球购物
意大利值得信赖的在线超级药房:PillolaStore
2020/02/05 全球购物
北京银河万佳Java面试题
2012/03/21 面试题
大学校园毕业自我鉴定
2014/01/15 职场文书
淘宝活动策划方案
2014/02/06 职场文书
初中学校军训方案
2014/05/09 职场文书
考生诚信考试承诺书
2014/05/23 职场文书
学校查摆问题整改措施
2014/09/28 职场文书