prerender-spa-plugin 预渲染插件的使用说明

1:单页面应用不利于SEO

SSH服务器端渲染

预渲染**

由于页面较少,且预渲染相对于SSH比较简单,于是选择预渲染页面,预渲染可以极大的提高网页访问速度。而且配合一些meat插件,基本可以 
满足SEO需求


webpack 配置  
 // https://github.com/chrisvfritz/prerender-spa-plugin
new PrerenderSPAPlugin({
  staticDir: config.build.assetsRoot,
  // Routes to render
  routes: [ '/', '/login' ,  ],
  //压缩html
  minify: {
    collapseBooleanAttributes: true,
    collapseWhitespace: true,
    decodeEntities: true,
    keepClosingSlash: true,
    sortAttributes: true
  },
  //这个没有配置成功过  可能是
  // renderer: new Renderer({
  //   inject: {
  //     foo: 'bar'
  //   },
  //   headless: false,
  //   renderAfterDocumentEvent: 'render-event'
  // })
})

我用的脚手架 vue-cli webpack
打包目录是public 里面其他文件是我们自己的一些东西不用管
之前打包后 是下面这样的

image.png

配置后 注意 routes: [ '/', '/login' , ],


image.png

就是把你当前的路由换成静态文件而已

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 129,291评论 18 137
  • 1 Webpack 1.1 概念简介 1.1.1 WebPack是什么 1、一个打包工具 2、一个模块加载工具 3...
    Kevin_Junbaozi阅读 5,888评论 0 16
  • (1) 有“中国流行民谣第一人”和“鼓王”之称的歌手赵牧阳,曾与汪峰等人一同撑起了“鲍家街43号”。乐队解散后,赵...
    后海的歌阅读 538评论 6 4
  • 真的开始倒计时了,心里却有点舍不得了,来J城已经有段时间了,可是现在要开始习惯离开,我是个慢热的人,可是却是个深情...
    小野家出品阅读 139评论 0 0
  • 对于一个即将踏入社会的大学生来说,大约都要头疼工作住宿的问题。暑假里因为在广州兼职,因为只短暂住宿一个多月,同伴们...
    婷婷在想什么阅读 1,746评论 18 39