node package manager
It’s your turn. Help us improve JavaScript. Take the 2017 JavaScript Ecosystem Survey »


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:

import path from 'path'
import { webpackServiceStandard as webpackService } from 'webpack-standards'
const config = webpackService
  .entry(path.resolve(__dirname, './src/index.jsx'))
  .output(path.resolve(__dirname, './dist'))

Here we're creating a React application in ES2015, and our starting code is in the src/index.js file:

import React from 'react'
import ReactDOM from 'react-dom'
import { AppContainer } from 'react-hot-loader'
import App from './App'
const render = () => {
      <App />
if ( {'./App', render)

This entry file references our root ./App component App.jsx in the same src folder:

/* eslint-disable react/prefer-stateless-function */
import React, { Component } from 'react'
class App extends Component {
  render() {
    return (
        <p>My App</p>
export default App

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.


For maintainers of webpack-standards:

Initial Setup

npm set "..."
npm set "...@..."
npm set "http://..."
npm adduser


  • Increment version in package.json
npm run push

Note the push script will run the build npm run build and then npm publish to push the package to the npm registry (