Build standardised webpack 2.x configurations
Getting Started
mkdir my-app
cd my-app
npm init
npm i react react-dom babel-polyfill --save
npm i babel-cli babel-register cross-env --save-dev
npm i webpack webpack-standards --save-dev
Create a server.js
folder in the root of your project:
const config = webpackService webpackService
Here we're creating a React application in ES2015, and our starting code is in the src/index.js
file:
const render = { ReactDOM} if modulehot modulehotaccept'./App' render
This entry file references our root ./App
component App.jsx
in the same src
folder:
/* eslint-disable react/prefer-stateless-function */ { return <div> <p>My App</p> </div> }
That's it for your application, now we update your package.json
to include start
and build
scripts:
"scripts": {
"start": "babel-node --presets es2015,stage-0,react server.js",
"build": "cross-env NODE_ENV=production webpack"
...
}
Because we installed the babel-cli
and babel-register
packages, we can write our server.js
file in ES2015 and use babel-node
from the command line. We can also use cross-env
to set the NODE_ENV
environment variable to production for our build.
Developers
For maintainers of webpack-standards
:
Initial Setup
npm set init.author.name "..."
npm set init.author.email "...@..."
npm set init.author.url "http://..."
npm adduser
Publishing
- Increment version in
package.json
npm run push
Note the
push
script will run the buildnpm run build
and thennpm publish
to push the package to the npm registry (https://registry.npmjs.org).