Learning Webpack 1

Description

In this course, you will learn:

• How to set up a webpack-dev-server to serve and reload files in real time as you make changes.
• How to install webpack, run a build, and edit the config file
• How to use loaders to run tasks and process files such as CSS, Sass, and inline images
• Code Splitting with webpack

Syllabus:

• Introduction
• What you should already know
• Using the exercise files
   

1. webpack

• What is webpack?
• Installing webpack
• Running a webpack build
• Understanding the webpack.config file
   

2. webpack Loaders

• What is a loader?
• Setting up babel-loader for a React or ES6 project
• Using presets
• Setting up coffee-loader for CoffeeScript projects
   

3. webpack & CSS

• Why load CSS with webpack?
• Transpiling Sass with webpack
• Loading images with webpack
   

4. Code Splitting with webpack

• What is code splitting?
• Adding multiple entry points
• Using the commons chunk bundle
• Bundling vendor files
   

5. webpack-dev-server

• What is the webpack-dev-server?
• Setting up the webpack-dev-server