单页面应用(SPA)对于SEO不友好的问题可以通过预渲染(Prerender)和服务端渲染(SSR)技术解决
本文主要记录预渲染技术在vue cli构建的项目中的使用
用到插件、

示例基于
vue：“^2.6.11”
vue-cli：“~4.5.0”

⚠️： 中路由模式一定要修改为 才能生效，模式生成的页面都是一样的

（的主要原理是，渲染完成后，然后再）

vue-cli4.x项目默认没有(3.x同样没有)，请手动创建
配置如下：
基本不需要修改，除了那里的配置，要改成你自己的路由

更多配置访问
https://github.com/chrisvfritz/prerender-spa-plugin#about-prerender-spa-plugin

此方法名要跟上面的 中配置的一致

要使用到插件

vue-meta-info 是一个基于vue 2.0的插件，它会让你更好的管理你的 app 里面的 meta 信息。你可以直接 在组件内设置 metaInfo 便可以自动挂载到你的页面中。当然，有时候我们也可能会遇到让人头疼的SEO问题，那么使用此插件配合 prerender-spa-plugin 也是再合适不过了

安装：

引入：

组件内使用：
每个组件都可以设置不同的配置项

具体步骤已经结束了，下面简易记录一下

• 搜索引擎蜘蛛(网络爬虫)自动抓取网页内容时，会分析页面内容，例如：从 meta 标签中读取 keywords 、 description 的内容、根据语义化的 html 的标签爬取和分析内容
• 搜索引擎蜘蛛在爬取的过程中，不会去执行js，所以隐藏在js中的跳转也不会获取到，vue通过js控制路由然后渲染出对应的页面，而搜索引擎蜘蛛是不会去执行页面的js的，导致搜索引擎蜘蛛只能收录index.html一个页面，在百度中就搜索不到相关的子页面的内容