解决vue脚手架项目打包后路由视图不显示的问题


Posted in Javascript onSeptember 20, 2018

脚手架vue-cli 搭建的项目,build后放于服务器上,发现其他资源全部变成静态加载成功,但路由视图为空,最初以为是webpack打包的问题,找了好久发现是路由配置问题。

解决办法如下:

Vue.use(VueRouter)
const router = new VueRouter({
 mode: 'history', 
 base: '/system/',    //添加根目录
 scrollBehavior: () => ({ y: 0 }),
 routes
})

比如我是将打包后的dist和index.html放在tomcat上的system下,router 的根目录就是system。

方法很简单,但是找到问题并解决的过程。。。很虐很享受啊

以上这篇解决vue脚手架项目打包后路由视图不显示的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery 过滤方法filter()选择具有特殊属性的元素
Jun 15 Javascript
jQuery的css() 方法使用指南
May 03 Javascript
Bootstrap时间选择器datetimepicker和daterangepicker使用实例解析
Sep 17 Javascript
AngularJs中 ng-repeat指令中实现含有自定义指令的动态html的方法
Jan 19 Javascript
php register_shutdown_function函数详解
Jul 23 Javascript
Vue Router去掉url中默认的锚点#
Aug 01 Javascript
微信小程序动画组件使用解析,类似vue,且更强大
Aug 01 Javascript
Layui数据表格跳转到指定页的实现方法
Sep 05 Javascript
vue中注册自定义的全局js方法
Nov 15 Javascript
JsonServer安装及启动过程图解
Feb 28 Javascript
分享8个JavaScript库可更好地处理本地存储
Oct 12 Javascript
11个Javascript小技巧帮你提升代码质量(小结)
Dec 28 Javascript
微信小程序onLaunch异步,首页onLoad先执行?
Sep 20 #Javascript
vue3.0 CLI - 3.2 路由的初级使用教程
Sep 20 #Javascript
微信小程序使用gitee进行版本管理
Sep 20 #Javascript
jQuery easyui datagird编辑行删除行功能的实现代码
Sep 20 #jQuery
解决Vue-cli npm run build生产环境打包,本地不能打开的问题
Sep 20 #Javascript
jQuery 点击获取验证码按钮及倒计时功能
Sep 20 #jQuery
Vuex 快速入门(简单易懂)
Sep 20 #Javascript
You might like
PHP网上调查系统
2006/10/09 PHP
15种PHP Encoder的比较
2007/04/17 PHP
PHP 实现类似js中alert() 提示框
2015/03/18 PHP
php中文繁体和简体相互转换的方法
2015/03/21 PHP
通过PHP的Wrapper无缝迁移原有项目到新服务的实现方法
2020/04/02 PHP
js 强制弹出窗口代码研究-又一款代码
2010/03/20 Javascript
javascript控制Div层透明属性由浅变深由深变浅逐渐显示
2013/11/12 Javascript
js判断iframe内的网页是否滚动到底部触发事件
2014/03/18 Javascript
js读取json的两种常用方法示例介绍
2014/10/19 Javascript
对Web开发中前端框架与前端类库的一些思考
2015/03/27 Javascript
解析JavaScript数组方法reduce
2016/12/12 Javascript
requirejs按需加载angularjs文件实例
2017/06/08 Javascript
微信小程序WebSocket实现聊天对话功能
2018/07/06 Javascript
页面内锚点定位及跳转方法总结(推荐)
2019/04/24 Javascript
jQuery实现条件搜索查询、实时取值及升降序排序的方法分析
2019/05/04 jQuery
layui form.render('select', 'test2') 更新渲染的方法
2019/09/27 Javascript
Vue通过getAction的finally来最大程度避免影响主数据呈现问题
2020/04/24 Javascript
微信小程序实现滚动Tab选项卡
2020/11/16 Javascript
python网页请求urllib2模块简单封装代码
2014/02/07 Python
Python中使用item()方法遍历字典的例子
2014/08/26 Python
Python中的条件判断语句与循环语句用法小结
2016/03/21 Python
python 截取 取出一部分的字符串方法
2017/03/01 Python
python中for用来遍历range函数的方法
2018/06/08 Python
在python中对变量判断是否为None的三种方法总结
2019/01/23 Python
python3对接mysql数据库实例详解
2019/04/30 Python
一篇文章了解Python中常见的序列化操作
2019/06/20 Python
Python 如何优雅的将数字转化为时间格式的方法
2019/09/26 Python
Tensorflow的梯度异步更新示例
2020/01/23 Python
简单聊聊H5的pushState与replaceState的用法
2018/04/03 HTML / CSS
英国第一摩托车和摩托车越野配件商店:GhostBikes
2019/03/10 全球购物
Geekbuying波兰:购买中国电子产品
2019/10/20 全球购物
2014年卫生院工作总结
2014/12/03 职场文书
Nginx 根据URL带的参数转发的实现
2021/04/01 Servers
React Native项目框架搭建的一些心得体会
2021/05/28 Javascript
Windows下redis下载、redis安装及使用教程
2021/06/02 Redis
Mysql数据库group by原理详解
2022/07/07 MySQL