Vue Router系列之（十三）路由器的两种工作模式

路由器的两种工作模式

1. 对于一个url来说，什么是hash值？—— #及其后面的内容就是hash值。

2. hash值不会包含在 HTTP 请求中，即：hash值不会作为路径的一部分随着http请求带给服务器。【#/。。。】

   

3. hash模式：默认的工作模式

   1. 地址中永远带着#号，路由的名是以hash值的形式呈现的，不美观 。
   2. 若以后将地址通过第三方手机app分享，若app校验严格，则地址会被标记为不合法。
   3. 对于浏览器的兼容性较好。

4. history模式：

   1. 地址干净，美观 。

   2. 对于浏览器的兼容性和hash模式相比略差。

   3. 应用部署上线【将dist部署到服务器】时需要后端人员支持，解决刷新页面服务端404的问题。【history模式404的问题】

      解决该问题的思路：区分出前端路由和后端路由【后端路由是写在server.js中的】

      nodejs中专门用于解决上述问题的中间件：connect-history-api-fallback【服务器中的中间件】

      注：nginx也可解决上述问题

5. 设置路由器的工作模式

   //创建并暴露一个路由器
   const router =  new VueRouter({
   	mode:'history',
     	//mode:'hash',
   	routes:[...]
   })
   

脚手架的特点：我们修改了代码保存后，浏览器会在当前路径进行刷新

打包：生成最纯粹的.html、.css、.js文件

vue-cli-service serve：开启内置的8080服务器，用于支撑项目运行

vue-cli-service build：打包

【项目运行中不会影响打包】

打包过程的长短取决于项目大小以及硬盘的读写速度

打包的文件包括src和public

打包后的dist目录必须部署在服务器上才能访问到

IE 8及其以下浏览器运行不了Vue项目