webpackman-react

webpackman

[WIP] Reduce webpack workflow to 2 scripts: "wbuild" and "wserve"

Install

$ npm install webpackman -D
$ npm install babel-preset-es2015 babel-preset-stage-0 babel-preset-react babel-preset-react-hmre -D

// .babelrc
{
  "presets": ["es2015", "stage-0", "react"],
  "env": {
    "development": {
      "presets": ["react-hmre"]
    }
  }
}

// package.json
{
  "scripts": {
    "start": "wserve",
    "build": "NODE_ENV=production rm -rf dist && wbuild"
  }
}

Usage

$ npm start # open localhost:8080
$ npm run build # content will be in the dist folder

webpackman assumes you have a following structure

src
│ index.js
| *.css (will be loaded as global css)
└─components
  |    
  └─component-name
    |
    └─component-name.js
      *.css (will be loaded as css-module)

Override default config

Via arguments

$ wbuild --x-entry lib/entry.js
$ wbuild --x-html lib/index.html
$ wbuild --x-dist output

Programmatically

You need to add --config argument to wserve and wbuild.

$ wbuild --config config.prod.js
$ wserve --config config.dev.js

⚠️ --config <file> should be always first if presented

// config.dev.js
const config = require('webpackman/webpack.config.dev.js')
// ...
// modify config
// ...
module.exports = config;

// config.prod.js
const config = require('webpackman/webpack.config.prod.js')
// ...
// modify config
// ...
module.exports = config;

Changelog

v0.1.0 - initial version with my opinionated react config

Used in

• ewnd9/media-center (migration commit)
• ewnd9/the-feed (migration commit)

License

MIT © ewnd9