Skip to content

Latest commit

 

History

History
39 lines (29 loc) · 1.23 KB

prerender.md

File metadata and controls

39 lines (29 loc) · 1.23 KB

Prerendering for SEO

If you want to prerender routes that will not significantly change once pushed to production, use this Webpack plugin: prerender-spa-plugin, which has been tested for use with Vue. For pages that do frequently change, Prerender.io and Netlify both offer plans for regularly re-prerendering your content for search engines.

Using prerender-spa-plugin

  1. Install it as a dev dependency:
npm install --save-dev prerender-spa-plugin
  1. Require it in build/webpack.prod.conf.js:
// This line should go at the top of the file where other 'imports' live in
const PrerenderSpaPlugin = require('prerender-spa-plugin')
  1. Configure it in the plugins array (also in build/webpack.prod.conf.js):
new PrerenderSpaPlugin(
  // Path to compiled app
  path.join(__dirname, '../dist'),
  // List of endpoints you wish to prerender
  [ '/' ]
)

If you also wanted to prerender /about and /contact, then that array would be [ '/', '/about', '/contact' ].

  1. Enable history mode for vue-router:
const router = new VueRouter({
  mode: 'history',
  routes: [...]
})