# react-router4-with-layouts

> > Allow Router to have layout prop with typescript definitions

Latest version **1.4.2** (published 2021-03-21) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-router4-with-layouts
pnpm add react-router4-with-layouts
yarn add react-router4-with-layouts
bun add react-router4-with-layouts
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.4.2 |
| Published | 2021-03-21 |
| First published | 2017-12-15 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 17.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 2 |
| Author | Vytenis Kučiauskas |
| Maintainers | fdiskas |

## Links

- npm: https://www.npmjs.com/package/react-router4-with-layouts
- Repository: https://github.com/nfq-eta/react-router4-with-layouts
- Homepage: https://github.com/nfq-eta/react-router4-with-layouts#readme
- Issues: https://github.com/nfq-eta/react-router4-with-layouts/issues
- npm.io page: https://npm.io/package/react-router4-with-layouts

## Dependencies (1)

- [tslib](https://npm.io/package/tslib.md) ^2.1.0

## Recent versions

- 1.4.2 (latest) — 2021-03-21
- 1.4.1 — 2019-07-14
- 1.4.0 — 2019-05-21
- 1.3.1 — 2018-09-26
- 1.3.0 — 2018-09-26
- 1.2.8 — 2018-03-25
- 1.2.7 — 2018-03-25
- 1.2.6 — 2017-12-17
- 1.2.5 — 2017-12-17
- 1.2.4 — 2017-12-17
- 1.2.3 — 2017-12-17
- 1.2.2 — 2017-12-17
- 1.2.1 — 2017-12-17
- 1.2.0 — 2017-12-17
- 1.1.7 — 2017-12-17
- … 10 more at https://npm.io/package/react-router4-with-layouts/versions

## README

# react-router4-with-layouts

> Allow Router to have layout prop with typescript definitions

[![NPM](https://img.shields.io/npm/v/react-router4-with-layouts.svg)](https://www.npmjs.com/package/react-router4-with-layouts)
[![build](https://api.travis-ci.org/nfq-eta/react-router4-with-layouts.svg?branch=master)](https://travis-ci.org/github/nfq-eta/react-router4-with-layouts)

## Install

```bash
yarn add react-router4-with-layouts
```

## Usage [more info](https://github.com/nfq-eta/react-router4-with-layouts/tree/master/example)

```jsx
import React, { Component } from 'react';
import { Route } from 'react-router4-with-layouts';
import { Router, Switch } from 'react-router-dom';
import { createBrowserHistory } from 'history';

import { DefaultLayout } from './layouts/DefaultLayout';
import { HomePage } from './pages/HomePage';
import { LoginPage } from './pages/LoginPage';
import { EmptyLayout } from './layouts/EmptyLayout';

const history = createBrowserHistory();

export default class App extends Component {
  render () {
    return (
      <Router history={history}>
        <Switch>
          <Route path="/" component={HomePage} exact layout={DefaultLayout} />
          <Route path="/login" component={LoginPage} layout={EmptyLayout} />
        </Switch>
      </Router>
    );
  }
}
```

## Todo:
* [ ] Add tests
* [ ] Refactor example and use StoryBook
* [x] Add travis to publish new releases
* [x] Add changelog

## License

MIT © [Vytenis Kučiauskas](https://github.com/FDiskas)

> **NOTE** Thanks to [react-modern-library-boilerplate](https://github.com/transitive-bullshit/react-modern-library-boilerplate)

---
_Source: https://npm.io/package/react-router4-with-layouts · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
