webpack-tutorial

by emiloberg

emiloberg / webpack-tutorial

Webpack tutorial held at Uppsala JS

207 Stars 51 Forks Last release: Not found 4 Commits 0 Releases

Available items

No Items, yet!

The developer of this repository has not created any items for sale yet. Need a bug fixed? Help with integration? A different license? Create a request here:

webpack-tutorial

This repo contains what was demonstrated on Uppsala.js, November 3, 2016.

Together we built a Javascript app and explored many parts of Webpack and how we can use Webpack to create production ready code as well as use it to help with our development process.

Tutorial explains:

  • What is Webpack
  • Webpack vs Gulp, Grunt, Browserify, Rollup, NPM Scripts
  • How to create a production ready bundle
  • How to do code splitting
  • How to do dead code elimination
  • How to do tree shaking to remove dead code
  • How to do hot module replacement (HMR)
  • How to do hot/live reload
  • How to use ES6/ES.next/ES2015 code in production with Babel
  • How to load images
  • How to load style (css)
  • ...and more

Video and Slides

YouTube Screenshot

Installation

1. Install

# Clone this repo
git clone https://github.com/emiloberg/webpack-tutorial.git

Install dependencies

npm install

Run for development

npm run dev

go to http://localhost:8080

Run for production

npm run build

Links

Things in the presentation

State of Javascript


Webpack

Webpack Dev Server

Plugins

Loaders

More things to read

Contact

Feel free to contact me:

// Emil Oberg

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.