Webpack hands-on training

Why do we need a build step?

  • code size
  • assets size
  • code splitting
  • transpilation
  • debuging methods
  • code quality
  • optimisations
  • environment specific tasks
  • etc.

Webpack

vs

Grunt/Gulp/Browserify

?

Two things you should keep in mind

  1. Install your dependencies threw NPM  (good riddance BowerJS)
  2. Use a Module System

Modules in JavaScript

Module Pattern (Anywhere)

 

AMD ( Webpack, RequireJS)

 

CommonJS (Webpack, Nodejs, Browserify)

 

ES Modules (Webpack 2 beta)

 

What's the purpose of this?

  1. understanding a webpack configuration file
  2. how to integrate webpack with your project
  3. build for multiple enviroments
  4. having to know and play with webpack

ok enough... let's code!

Webpack Hands on training

By Andrei Cacio

Webpack Hands on training

A small introduction about how webpack works and why is it useful

  • 1,923