vue系列：当vue路由配置history模式页面加载不出来的bug

概述在vue中，当你路由配置 history 模式的时候，在你本地跑 localhost:8080 的时候没有问题，但是当你把 index.html 给后端，让他链接上你的 dist 文件的静态资源的时候，可能会出现页面加载不出来也不报错的情况。解决方案比如这时地址是 https://e.mytest.cn/example，你的路由是在 example 之后拼接的。方法一：你需要让后端在 ...

Lvan的前端笔记

4304人浏览 · 2019-08-22 10:26:07

Lvan的前端笔记 · 2019-08-22 10:26:07 发布

概述

在vue中，当你路由配置 history 模式的时候，在你本地跑 localhost:8080 的时候没有问题，但是当你把 index.html 给后端，让他链接上你的 dist 文件的静态资源的时候，可能会出现页面加载不出来也不报错的情况。

解决方案

比如这时地址是 https://e.mytest.cn/example，你的路由是在 example 之后拼接的。
方法一：你需要让后端在 <head></head> 中加一行代码
<base href="/example/">
方法二：在vue路由配置中加上 base 选项

export default new Router({
  mode: 'history',
  base: '/example/',
  routes: []
})

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^