# Static 

> **Configure a streamlined static site build pipeline for React**

This runner creates the necessary Webpack/Fuse-Box configuration and build tasks to
generate static HTML from a React project.  It's similar to tools like `react-static`, `Gatsby` and
`Next.js` but is much more lightweight as it's really just a slight reconfiguration of the 
BeRun `create-react-app` like pipeline.

Creating a static site essentially is like any other React project, but runs in two passes: the first
to build a dynamic website, the second to run every route of the dynamic website and save the results.

## Features

* React-router (v4+) aware
* CSS in JS aware (Emotion, Styled-Components, bring your own)
* Supports different build engines (Webpack, Fuse-Box) with hot reloading for rapid development
* Streamlined HTML plugins for Webpack, Fuse-Box with support for &lt;Head > sections, global CSS

This runner is a core component of the `BeStatic` site generator, but can be used standalone to create
your own site generator.

## Installation

[`@berun/runner-static`](https://www.npmjs.com/package/@berun/runner-static) is a common runner that is automatically
included by BeRun presets such as [`@berun/preset-bestatic`](https://www.npmjs.com/package/@berun/preset-bestatic).   If you 
need to install it directly, follow these directions:

```bash
$ npm install --save-dev @berun/runner-static
```

```js
// berun.config.ts
export default {
  use: [ '@berun/runner-static']
}
```

## Usage

Two Sparky tasks are exposed

```bash
# Run development docs server on localhost:3000
$ berun-scripts start:static

# Production docs build
$ berun-scripts build:static
```
Note: these two commands are usually included as npm scripts in `package.json`
