我们先观察浏览器地址栏
是不是在大部分浏览器路径中都可以看到这个带#号的路径
在前端中有两种工作模式分别是hash和history
hash（哈西）
#号后面的都算hash值 ( 例 : 图上模式) #号后面的值不会作为路径发送给服务器
优点：兼容性好
缺点：带#号不好看
history
优点：兼容略差
缺点：路径好看（不带#号）
问：那我们怎么决定模式呢？
答：mode:'hash/history'
例如：index.js
export default new VueRouter({
//写在这里
mode:'history',
routes:[
{
name:'XXX',
path:'XXX',
component:XXX,
},
})问：那我们怎么打包
答：在package.json文件中 找到build文件 其中serve是用于运行文件的
而build能把我们写的东西生成最纯粹的HTML CSS JavaScript文件
//打包代码
vue-cli-service build再寻找那个特殊文件夹就可以了 dist
注意：只打包src目录下文件
打包出来的文件必须要放在服务器上才可以使用 ———‘部署’
使用node.js和express搭建一个微型服务器 再部署上去
以下的东西看不懂很正常 如果需要知识面较广，可以了解一下。
第一步 npm init
npm init //变成一个合理的包第二步 npm i express
npm i express //安装express第三步 引入express
//引入express
const express =require('express')
//用一个app把他接住
const app=express()
//配置后段路由 /person 返回人的信息
//req- request res-response
app.get('/person',(rēq，res)=>{
res.sent({ //给客户端
name：’tom‘，
age：18
})
})
//端口监听
app.listen(端口号，(err)=>{
if(!err) console.log('服务器启动成功了！')
})第四步 启动服务器 node server
node server //启动服务器第五步 新建一个文件夹 一般叫 static（静态的）
里面放一些前端写完的东西
问: 怎么把页面让服务器去认识呢
答：我们一般是使用中间去完成
//const app=require（'express'）
//中间介 express身上有个中间介 static 专门用于指定静态资源 需要传入一个路径
app.use(express.static(__dirname+'/static'))
第六步 启动服务器 node server
就可以看到index.html页面了 默认打开index页面 如果不是名字index需要在路径处输入名字
第七步 把之前打包好的html css 和javascript文件复制过去 项目可以部署在服务器上
也可以正常跳转 但是我们发现他没有发生网络请求 一刷新就会出现问题 见下图
（上刷新下网络请求）
这是属于history存在路径问题
因为没有#号后面都是路径 而在我们的服务器中没有这个路径就会报错 而我们可以点击切换是因为前端路由跳转
hash模式 就不会存在这些问题 因为#后边的这些东西不算是 资源找服务器去要
关于history 404 问题的解决办法：
需要后端人员
我们使用node.js解决该问题
使用服务器中间介connect- history-api- fallback
代码在npm 网站中
第一步：
//在服务器中运行
npm install --save connect-history-api-fallback
第二步：
//引入
const history = require('connect-history-api-fallback');第三步：
//使用 必须在静态资源之前进行使用
app.use(history())
//中间介 express身上有个中间介 static 专门用于指定静态资源 需要传入一个路径
app.use(express.static(__dirname+'/static'))