基于Spring Boot+Vue的博客系统 23——博客前台细节优化

使用history路由

vue-router 默认 hash 模式 —— 使用URL的hash来模拟一个完整的 URL，于是当 URL 改变时，页面不会重新加载。

我们可以在/src/router/index.js中修改router配置，使用history模式的路由。

当使用 history 模式时，URL 就像正常的 url，例如 http://yoursite.com/user/id。
但是在使用history路由的时候也要注意后端的配置，因为一旦刷新页面，浏览器就会按URL向服务请求资源，浏览器并不知道这是路由。针对这种这种情况，Vue-Router官网提供了不同服务器的解决方法，这里以ngnix为例，只需在配置中添加以下配置即可：

详情可以参考：https://router.vuejs.org/zh/guide/essentials/history-mode.html

路由懒加载

当打包构建应用时，JavaScript 包会变得非常大，影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件，这样就更加高效了。

这时我们的路由可以写成这样（当我们每个路由的代码有很多的时候，比如我们配置子路由的时候，也可以将component属性抽取成单独一个文件）：