Princíp činnosti nástroja Webpack

Spravidla počas vývoja získame veľa JavaScript súborov, ktoré obsahujú rôzne časti kódu. Môžu to byť časti nášho kódu alebo knižnice tretích strán. To znamená, že každý takýto súbor musíme pripojiť k HTML súboru prostredníctvom tagu script.

Nie je to veľmi dobré, pretože veľa pripojených súborov spomaľuje rýchlosť načítania stránky. Preto na zrýchlenie načítania je potrebné celý kód zložiť do jedného súboru.

Avšak, vyvíjať kód v jednom spoločnom súbore tiež nie je veľmi pohodlné. Preto v súčasnosti sa praktizuje nasledujúci prístup: kód sa vyvíja v samostatných súboroch a potom sa pomocou nástroja na zostavenie zozbiera do jedného spoločného súboru, ktorý sa pripojí k HTML súboru.

Samostatné súbory predstavujú ES moduly. Tieto moduly sa pripájajú k iným súborom prostredníctvom príkazu import.

Zvyčajne sa vytvorí nejaký hlavný súbor, ku ktorému sa pripájajú ostatné súbory. Tento súbor sa nazýva vstupný bod.

Nástroj na zostavenie vstúpi do vstupného bodu, pozrie sa, ktoré moduly sú pripojené ku nemu. K týmto modulom môžu byť tiež pripojené ďalšie moduly. Nástroj na zostavenie prejde všetky pripojenia a nazbiera celý kód do jedného súboru. Tento súbor sa nazýva bandle.

Spravidla sa kód, ktorý programátor píše, nachádza v priečinku src, a zostavený kód sa umiestni do priečinka dist.