本文已参与「新人创作礼」活动,一起开启掘金创作之路
前言
vue 项目中,我们比较常用的模式为 hash 和 history 模式 默认情况下,vue 项目采用的就是 hash 模式 有些人对 history 模式下,为什么需要服务器做相应配置,以及如何配置不甚理解,所以这篇文章就对此做出分析,重点是让大家理解,为什么 history 模式下需要服务器做配置 这里会对 hash 模式和 history 模式都做出说明,通过对比,才能更好的理解我们的行为
1. hash 模式
1.1 什么是 hash 模式
先从一个熟悉的锚标记案例开始,帮助大家理解 hash 模式是怎么回事
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
ul {
list-style-type: none;
}
li {
line-height: 30px;
}
div {
height: 800px;
}
</style>
</head>
<body>
<ul>
<li><a href="#lish">历史沿革</a></li>
<li><a href="#mingren">名人典故</a></li>
<li><a href="#jinri">今日发展</a></li>
<li><a href="#weilai">未来规划</a></li>
</ul>
<div id="lish">
<h3>历史沿革</h3>
历史沿革历史沿革历史沿革历史沿革历史沿革历史沿革历史沿革历史沿革
</div>
<div id="ming