Skip to content
markdown guide

Recently also got into Webpack and found it hard to find simple explanations. So here goed my take:

Webpack is essentially just a bundler. It bundles your code: CSS, JS and others to 1 or 2 files (you can decide which and what it contains) into 1 bundle.js file. It can also compile Typescript to Javascript, LESS/SASS to CSS and so on. You use loaders and modules for this. You define all these setting in your webpack.config.js. There you say: "Use this plugin" or "Use this loader and if it doesn't work; fallback onto this one".

Combining all code to 1 or 2 bundles save up on space. Which is a good thing of course because less loading. Other bonus point: I don't have to rely on Codekit as a compiler anymore. I just run npm run watch (which is a webpack command you can configure to your own liking) and it will compile my code and watch for changes.

I can't find the tutorial I used right now, but I suggest you look for webpack 3 tutorials on Medium: plenty of simple step-by-step walkthroughs there.

Good luck!

Classic DEV Post from Jun 13 '19

Async, Parallel, Concurrent Explained - Starring Gordon Ramsay

Complex computing concepts simplified

Žane Suhadolnik profile image
Web Development, Programming, Computers, Books, Outdoors, Metal, Games, Random thoughts.

Customize your DEV feed to keep up with the frameworks and languages you care about.

Get Started