prerender-webpack-plugin v1.0.0

Prerender-webpack-plugin

What is Prerendering?

Pre-rendering describes the process of rendering a client-side application at build time, producing useful static HTML that can be sent to the browser instead of an empty bootstrapping page.

Pre-rendering is like Server-Side Rendering, just done at build time to produce static files. Both techniques help get meaningful content onto the user's screen faster.

How does it work?

1. After build, run a static web server using new files with express .
2. Open the web page with puppeteer, a headless browser.
3. After the browser rendering, get the html string and write it to html file.

Usage

Intall prerender-webpack-plugin as a development dependency:

npm i -D prerender-webpack-plugin

Add plugin to your webpack configuration:

const PrerenderWebpackPlugin = require('Prerender-webpack-plugin').default

...
    plugins: [
        new PrerenderWebpackPlugin()
    ]
...

or pass options

...
    plugins: [
        new PrerenderWebpackPlugin({
            ...options
        })
    ]
...

Options

All options are optional.