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中的sortable排序之后的保存状态的解决方法
Jan 28 Javascript
jQuery EasyUI API 中文文档 - Menu菜单
Oct 03 Javascript
HTML页面滚动时获取离页面顶部的距离2种实现方法
Sep 05 Javascript
jquery插件tooltipv顶部淡入淡出效果使用示例
Dec 05 Javascript
JavaScript将数据转换成整数的方法
Jan 04 Javascript
基于jquery插件编写countdown计时器
Jun 12 Javascript
JavaScript-定时器0~9抽奖系统详解(代码)
Aug 16 Javascript
解决Vue编译时写在style中的路径问题
Sep 21 Javascript
浅谈开发eslint规则
Oct 01 Javascript
vue中v-show和v-if的异同及v-show用法
Jun 06 Javascript
在Layui 的表格模板中,实现layer父页面和子页面传值交互的方法
Sep 10 Javascript
利用原生JS实现欢乐水果机小游戏
Apr 23 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
《DOTA3》开发工作已经开始 《DOTA3》将代替《DOTA2》
2021/03/06 DOTA
用PHP制作静态网站的模板框架(三)
2006/10/09 PHP
坏狼的PHP学习教程之第1天
2008/06/15 PHP
PHP Cookie的使用教程详解
2013/06/03 PHP
浅谈htmlentities 、htmlspecialchars、addslashes的使用方法
2016/12/09 PHP
Laravel框架用户登陆身份验证实现方法详解
2017/09/14 PHP
php使用curl伪造浏览器访问操作示例
2019/09/30 PHP
PHP7变量处理机制修改
2021/03/09 PHP
Javascript的IE和Firefox兼容性汇编(zz)
2007/02/02 Javascript
JavaScript 拾漏补遗
2009/12/27 Javascript
基于jquery的一个OutlookBar类,动态创建导航条
2010/11/19 Javascript
jQuery Tools tab(幻灯片)
2012/07/14 Javascript
jQuery插件开发全解析
2012/10/10 Javascript
使用javascipt---实现二分查找法
2013/04/10 Javascript
JSON 数字排序多字段排序介绍
2013/09/18 Javascript
Node.js事件驱动
2015/06/18 Javascript
用jquery获取自定义的标签属性的值简单实例
2016/09/17 Javascript
JS利用正则表达式实现简单的密码强弱判断实例
2017/06/16 Javascript
JavaScript之underscore_动力节点Java学院整理
2017/07/03 Javascript
Promise扫盲贴
2019/06/24 Javascript
解决vue cli使用typescript后打包巨慢的问题
2019/09/30 Javascript
JQuery事件委托(适用于给动态生成的脚本元素添加事件)
2020/02/01 jQuery
在vue项目中引用Antv G2,以饼图为例讲解
2020/10/28 Javascript
python实现根据窗口标题调用窗口的方法
2015/03/13 Python
Python的pycurl包用法简介
2015/11/13 Python
Python Django框架防御CSRF攻击的方法分析
2019/10/18 Python
Django Admin后台添加数据库视图过程解析
2020/04/01 Python
CSS3 transforms应用于背景图像的解决方法
2019/04/16 HTML / CSS
Html5新标签解释及用法
2012/02/17 HTML / CSS
门卫岗位职责
2013/11/15 职场文书
简历的自荐信
2013/12/19 职场文书
《小松树和大松树》教学反思
2014/02/20 职场文书
四议两公开实施方案
2014/03/28 职场文书
销售经理工作检讨书
2015/02/19 职场文书
《扇形统计图》教学反思
2016/02/17 职场文书
Centos环境下Postgresql 安装配置及环境变量配置技巧
2021/05/18 PostgreSQL