A toolkit for React, Preact, Inferno & vanilla JS apps, React libraries and other npm modules for the web, with no configuration (until you need it)
Latest commit 91ef6a0 Sep 4, 2018
Permalink
Failed to load latest commit information.
.github Update .github docs Jun 22, 2017
.vscode Add VS Code config Jun 12, 2017
docs Indicate that npm.umd.entry config is available from v0.23.0 onwards Aug 2, 2018
flow-typed Use a temporary scoped version of NpmInstallPlugin which supports Web… Mar 12, 2018
resources Add cover image to repo and pass props to @GeorgioWan Jun 17, 2017
src Update Flow and add new justshutuptypesystem annotations Aug 16, 2018
templates Update Node.js version in template CONTRIBUTING files Jul 6, 2018
tests Update dependencies Jul 17, 2018
.editorconfig Add an .editorconfig file Jan 24, 2017
.eslintignore Add flow libdef for expect May 28, 2017
.flowconfig Configure Flow to ignore node_modules/ Jun 20, 2017
.gitattributes Add configuration graph source Jan 8, 2016
.gitignore Tell npm 5 to leave package.json alone Jun 28, 2017
.npmrc Run tests in Node 8 and prevent creation of a package-lock.json with … Nov 3, 2017
.travis.yml Add Node.js 10 to test versions Jun 27, 2018
CHANGES.md Update dependencies Sep 4, 2018
LICENSE Drop --info, quieten middleware and add WebpackDXPlugin Jul 28, 2016
README.md Missed a few ES6 → ES changes Jun 22, 2018
appveyor.yml Update CHANGES for the uppgrade to Webpack 4 & dropping Node.js 4 sup… Mar 11, 2018
express.js Express middleware now supports all app project types, not just React Jan 11, 2017
package.json Update dependencies Sep 4, 2018
polyfills.js Add Object.assign to default polyfills Aug 12, 2016

README.md

nwb

Linux Travis Windows Appveyor npm package Coveralls

nwb

nwb is a toolkit for:

A zero-config development setup is provided, but nwb also supports configuration and plugin modules which add extra functionality (e.g. Sass support), should you need them

Install

Installing globally provides an nwb command for quick development and working with projects.

npm install -g nwb

Note: if you're using npm 5 and getting an EACCES: permission denied error from nwb's PhantomJS dependency while installing globally, try passing an --unsafe-perm flag:

npm install -g --unsafe-perm nwb

To use nwb's tooling in a project, install it as a devDependency and use nwb commands in package.json "scripts":

npm install --save-dev nwb
{
  "scripts": {
    "start": "nwb serve-react-app",
    "build": "nwb build-react-app"
  }
}

Quick Development

For quick development with React, Inferno, Preact or vanilla JavaScript, use the nwb react, nwb inferno, nwb preact or nwb webcommands.

import React, {Component} from 'react'

export default class App extends Component {
  render() {
    return <h1>Hello world!</h1>
  }
}
$ nwb react run app.js
✔ Installing react and react-dom
Starting Webpack compilation...
Compiled successfully in 5033 ms.

The app is running at http://localhost:3000/
$ nwb react build app.js
✔ Building React app

File size after gzip:

  dist\app.cff417a3.js  46.72 KB

See Quick Development with nwb for a more detailed guide.

React Apps

Use nwb new react-app to create a React app skeleton, preconfigured with npm scripts which use nwb for development:

nwb new react-app my-app
cd my-app/
npm start

Open localhost:3000, start editing the code and changes will be hot-reloaded into the running app.

npm test will run the app's tests and npm run build will create a production build.

See Developing React Apps with nwb for a more detailed guide.

Preact Apps

Use nwb new preact-app to create a Preact app skeleton:

nwb new preact-app my-app

Inferno Apps

Use nwb new inferno-app to create an Inferno app skeleton:

nwb new inferno-app my-app

Vanilla JavaScript Apps

Use nwb new web-app to create a vanilla JavaScript app skeleton:

nwb new web-app my-app

React Components and Libraries

nwb new react-component my-component

cd my-component/

npm start will run a demo app you can use to develop your component or library against.

npm test will run the project's tests and npm run build will create ES5, ES modules and UMD builds for publishing to npm.

See Developing React Components and Libraries with nwb for a more detailed guide.

npm Modules for the Web

nwb new web-module my-module

cd my-module/

npm test will run the project's tests and npm run build will create ES5, ES modules and UMD builds for publishing to npm.

Guides

Documentation

Why use nwb?

Get started quickly. Start developing from a single .js file or generate a project skeleton.

Covers the whole development cycle. Development tools, testing and production builds for projects work out of the box, no configuration required.

Flexible. While everything works out of the box, you can also use an optional configuration file to tweak things to your liking.

Manages key development dependencies and configuration for you. Check out an example of the effect using nwb had on the amount of devDependencies and configuration to be managed in a real project it was dropped into.

MIT Licensed

Cover image created by GeorgioWan

Operating system icons created with Icons8