Webpack2

npm view webpack versions ------ list all versions
npm show webpack version  ------ list latest version

webpack 1 vs 2
- 2 handles ex6 imports

run webpack
 ./node_modules/webpack/bin/webpack.js <input file> <output file>
 
 in package.json, do:
 "scripts": {
    "build": "webpack index.js bundle.js"
  },
  
  create module
  -messages.js
  
  add watcher
  add webpack.config.js
  
  hot module replacement: rebuild chunk and inject code into browser = state of app will change, when reloade browser, accept
  the change
  
  install webpack-dev-server
  
  webpackHotModuleReplacementPlugin
  page not reload, inject change to page
  
  
  config source-map in webpack.congif.js
  
  to handle files in webpack
  install file-loader
  
  to make it data-url, if img smaller than sertain size, use it as data-url(base64 encode url) otherwise use file-loader way
  install url-loader
  
  tree shaking
  need 
  need webpack.optimize.UglifyJsPlugin
  
  css-loader => understand css
  style-loader => inject style tag in html head
  
  npm info extract-text-webpack-plugin versions => show all versions