###### After `npm init` and you do all that noise, for setup

1) `npm install --save-dev webpack webpack-dev-server babel-loader babel-core`

_Note: insert `react-hot-loader` and `react` etc, if you are working on React projects_

example: `npm install --save react react-dom history react-router`

2) `touch webpack.config.js` and add this boilerplate:

```module.exports = {
  entry: "./src/index.js",
  output: {
    path: __dirname + "/dist",
    filename: "bundle.js"
  },
  module: {
    loaders: [
      { test: /\.js$/, exclude: /node_modules/, loader: "babel-loader" }
    ]
  },
  externals: {
    "jquery": "jQuery"
  }
}
```

- Every JavaScript file will be processed by babel during the bundling

3) Setup a preset

`npm install --save-dev babel-preset-latest`

4) Create a file called `.bablerc` in project root. Paste this:

```{
  "presets": ["latest"]
}
```

5) Open package.json and append:

```"build": "webpack",
    "watch": "webpack --watch"```

6) `npm install --save-dev node-sass`

and then add that compile to webpack command

7) ```"build": "webpack && node-sass ./scss -o ./css && exit 0",
    "watch": "webpack --watch & node-sass --watch ./scss -o ./css"```

    - for build, bundle the JS, compile the SCSS and then exit
    - for watch, both actions stay running indefinitely