vue spa预渲染

本文主要用于记录在单页面SEO优化中遇到的问题

技术栈：vue-cli  webpack  vue-meta-info  prerender-spa-plugin


prerender-spa-plugin：通过puppeteer爬取网页内容，输出成HTML文件保存在本地

1.引入prerender-spa-plugin，此过程可能会遇到puppeteer安装失败，可改用cnpm淘宝镜像安装；在webpack的配置文件中导入此插件（因为预渲染在打包成功之前）

2.在webpackConfig的plugins中配置需要生成预渲染的页面

3.在config文件夹的index.js中根据情况更改路径

4.在main.js中加上下面代码（存疑？？）


5.npm run build生成的dist文件中包含需要预渲染的路径的html文件


vue-meta-info：npm安装插件，在mian.js中导入挂载

在需要设置keywords等属性的页面进行如下设置

©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容