Skip to content

Commit

Permalink
instructions
Browse files Browse the repository at this point in the history
  • Loading branch information
piuccio committed Jun 26, 2017
1 parent 068e5dd commit 92e4749
Showing 1 changed file with 58 additions and 0 deletions.
58 changes: 58 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,58 @@
# Generate static pages from single page applications

Few tool out there allow you to pre-render web applications to static pages either using webpack or fake browser.

This package uses [headless chrome](https://developers.google.com/web/updates/2017/04/headless-chrome) for a more accurate pre-rendering in an actual browser.

## Usage

```js
const render = require('prerender-chrome-headless');
const fs = require('fs');

render('https://google.com').then((html) => {
fs.writeFileSync('/tmp/rendered-page.html', html);
});
```

### Chrome flags

By default this package runs chrome with `--disable-gpu` and `--headless` you can pass additional [flags](http://peter.sh/experiments/chromium-command-line-switches/) calling

```js
render(url, ['--disable-http2'])
```

## Continuous integration

The package works on any machine with Chrome installed. Most CI environments allows you to install external packages.

### Travis

Here is what you have to do to get Chrome headless working on Travis

```yml
# The default at the time of writing this blog post is Ubuntu `precise`
# Chrome addon is only available on trusty+ or OSX
dist: trusty

# This will install Chrome stable (which already supports headless)
addons:
chrome: stable

before_install:
# Needed by `chrome-launcher`
- export LIGHTHOUSE_CHROMIUM_PATH=google-chrome-stable

install:
# Run your build script that fetches a page and writes the output
- node generate_static_page.js
```
# Related links
* [static-site-generator-webpack-plugin](https://github.com/markdalgleish/static-site-generator-webpack-plugin) webpack plugin that generates static pages from your universal application.
* [react-snapshot](https://github.com/geelen/react-snapshot) runs your React application inside a fake browser, [jsdom](https://github.com/tmpvar/jsdom)
* [prerender-spa-plugin](https://github.com/chrisvfritz/prerender-spa-plugin) webpack plugin that uses Phantom.JS.
* [chrome-render](https://github.com/gwuhaolin/chrome-render) render any web page inside chrome headless browser, only works in node 7+.

0 comments on commit 92e4749

Please sign in to comment.