解决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 相关文章推荐
javascript 限制输入脚本大全
Nov 03 Javascript
基于jQuery的左右滚动实现代码
Dec 03 Javascript
js取值中form.all和不加all的区别介绍
Jan 20 Javascript
JavaScript中的prototype和constructor简明总结
Apr 05 Javascript
你所不了解的javascript操作DOM的细节知识点(一)
Jun 17 Javascript
jQuery.prop() 使用详解
Jul 19 Javascript
javascript实现html页面之间参数传递的四种方法实例分析
Dec 15 Javascript
Boostrap入门准备之border box
May 09 Javascript
深入理解MVC中的时间js格式化
May 19 Javascript
Bootstrap布局组件教程之Bootstrap下拉菜单
Jun 12 Javascript
详解Angular-Cli中引用第三方库
May 21 Javascript
基于vue+element实现全局loading过程详解
Jul 10 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验证手机号码(支持归属地查询及编码为UTF8)
2013/02/01 PHP
php利用curl抓取新浪微博内容示例
2014/04/27 PHP
PHP获取当前完整URL地址的函数
2014/12/21 PHP
PHP贪婪算法解决0-1背包问题实例分析
2015/03/23 PHP
PHP CURL使用详解
2019/03/21 PHP
Thinkphp 框架配置操作之动态配置、扩展配置及批量配置实例分析
2020/05/15 PHP
避免 showModalDialog 弹出新窗体的原因分析
2010/05/31 Javascript
jquery上传插件fineuploader上传文件使用方法(jquery图片上传插件)
2013/12/05 Javascript
返回上一页并自动刷新的JavaScript代码
2014/02/19 Javascript
Jquery实现弹性滑块滑动选择数值插件
2015/08/08 Javascript
jQuery实现带延迟的二级tab切换下拉列表效果
2015/09/01 Javascript
JavaScript事件类型中UI事件详解
2016/01/14 Javascript
js将滚动条滚动到指定位置的简单实现方法
2016/06/25 Javascript
Vue学习笔记进阶篇之函数化组件解析
2017/07/21 Javascript
webpack踩坑之路图片的路径与打包
2017/09/05 Javascript
微信小程序之事件交互操作实例分析
2018/12/03 Javascript
微信小程序云开发之使用云函数
2019/05/17 Javascript
Vue项目使用localStorage+Vuex保存用户登录信息
2019/05/27 Javascript
JavaScript跳出循环的三种方法(break, return, continue)
2019/07/30 Javascript
在vue中使用防抖和节流,防止重复点击或重复上拉加载实例
2019/11/13 Javascript
vue 项目引入echarts 添加点击事件操作
2020/09/09 Javascript
python中argparse模块用法实例详解
2015/06/03 Python
Python 3中的yield from语法详解
2017/01/18 Python
Python操作使用MySQL数据库的实例代码
2017/05/25 Python
Python正则表达式指南 推荐
2018/10/09 Python
bluepy 一款python封装的BLE利器简单介绍
2019/06/25 Python
Tensorflow Summary用法学习笔记
2020/01/10 Python
Jupyter Notebook折叠输出的内容实例
2020/04/22 Python
Python工程师必考的6个经典面试题
2020/06/28 Python
Python 如何创建一个线程池
2020/07/28 Python
Python中logger日志模块详解
2020/08/04 Python
python如何绘制疫情图
2020/09/16 Python
pycharm2020.1.2永久破解激活教程,实测有效
2020/10/29 Python
关于django python manage.py startapp 应用名出错异常原因解析
2020/12/15 Python
国旗下的演讲稿
2014/05/08 职场文书
七个Python必备的GUI库
2021/04/27 Python