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 相关文章推荐
jQuery中将函数赋值给变量的调用方法
Mar 23 Javascript
jquery ajax 局部无刷新更新数据的实现案例
Feb 08 Javascript
jquery JSON的解析方式示例介绍
Jul 27 Javascript
node.js中Socket.IO的进阶使用技巧
Nov 04 Javascript
Javascript动画的实现原理浅析
Mar 02 Javascript
详细谈谈AngularJS的子级作用域问题
Sep 05 Javascript
详解vue + vuex + directives实现权限按钮的思路
Oct 24 Javascript
完美解决axios跨域请求出错的问题
Feb 05 Javascript
vue二级路由设置方法
Feb 09 Javascript
Hexo已经看腻了,来手把手教你使用VuePress搭建个人博客
Apr 26 Javascript
微信小程序实现打卡日历功能
Sep 21 Javascript
详解Angular Karma测试的持续集成实践
Nov 15 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
CodeIgniter图像处理类的深入解析
2013/06/17 PHP
destoon实现首页显示供应、企业、资讯条数的方法
2014/07/15 PHP
php5.x禁用eval的操作方法
2018/10/19 PHP
jquery 最简单易用的表单验证插件
2010/02/27 Javascript
JQuery为textarea添加maxlength属性的代码
2010/04/07 Javascript
js捕获鼠标右键菜单中的粘帖事件实现代码
2013/04/01 Javascript
web网页按比例显示图片实现原理及js代码
2013/08/09 Javascript
Jquery模仿Baidu、Google搜索时自动补充搜索结果提示
2013/12/26 Javascript
js限制input标签中只能输入中文
2015/06/26 Javascript
jquery实现带缩略图的可定制高度画廊效果(5种)
2015/08/28 Javascript
仅9张思维导图帮你轻松学习Javascript 就这么简单
2016/06/01 Javascript
js常用的继承--组合式继承
2017/03/06 Javascript
Angular.js中处理页面闪烁的方法详解
2017/03/09 Javascript
Bootstrap Multiselect 常用组件实现代码
2017/07/09 Javascript
详解cordova打包成webapp的方法
2017/10/18 Javascript
从零开始搭建一个react项目开发
2018/02/09 Javascript
webpack+react+antd脚手架优化的方法
2018/04/02 Javascript
详解Vue项目在其他电脑npm run dev运行报错的解决方法
2018/10/29 Javascript
说说如何在Vue.js中实现数字输入组件的方法
2019/01/08 Javascript
[05:08]2014DOTA2国际邀请赛 Hao专访复仇的胜利很爽
2014/07/15 DOTA
详解python发送各类邮件的主要方法
2016/12/22 Python
python对json的相关操作实例详解
2017/01/04 Python
Python基于回溯法子集树模板解决选排问题示例
2017/09/07 Python
PyQt5实现五子棋游戏(人机对弈)
2020/03/24 Python
python使用pandas处理excel文件转为csv文件的方法示例
2019/07/18 Python
python+pygame实现坦克大战
2019/09/10 Python
Python semaphore evevt生产者消费者模型原理解析
2020/03/18 Python
Django REST framwork的权限验证实例
2020/04/02 Python
Pycharm及python安装详细步骤及PyCharm配置整理(推荐)
2020/07/31 Python
需要知道的CSS3动画技术
2010/01/01 HTML / CSS
Opodo英国旅游网站:预订廉价航班、酒店和汽车租赁
2018/07/14 全球购物
时尚圣经:The Fashion Bible
2019/03/03 全球购物
《乌塔》教学反思
2014/02/17 职场文书
1000字打架检讨书
2014/11/03 职场文书
2015年政协委员工作总结
2015/05/20 职场文书
新娘婚礼答谢词
2015/09/29 职场文书