Načelo delovanja zbiralnika Webpack

Pravioma imamo med razvojem veliko JavaScript datotek, ki vsebujejo različne dele kode. To so lahko deli naše kode ali knjižnice tretjih oseb. Izkazalo se je, da moramo vsako takšno datoteko povezati v HTML datoteko prek oznake script.

To ni zelo dobro, saj veliko povezanih datotek upočasni hitrost nalaganja spletnega mesta. Zato je za pospešitev nalaganja potrebno vso kodo združiti v eno datoteko.

Vendar tudi razvijanje kode v eni skupni datoteki ni zelo priročno. Zato se trenutno uporablja naslednji pristop: koda se razvija v ločenih datotekah, nato pa se s pomočjo zbiralnika zbere v eno skupno datoteko, ki se poveže z HTML datoteko.

Posamezne datoteke predstavljajo ES module. Ti moduli so povezani z drugimi datotekami prek ukaza import.

Običajno ustvarimo neko glavno datoteko, ki ji so povezane vse ostale datoteke. Ta datoteka se imenuje vstopna točka.

Zbiralnik gre v vstopno točko, pogleda, kateri moduli so povezani nanjo. Tudi na te module so lahko povezani drugi moduli. Zbiralnik sledi vsem povezavam in zbere vso kodo v eno datoteko. Ta datoteka se imenuje bundle (paket).

Pravioma se koda, ki jo programer napiše, nahaja v mapi src, zbrana koda pa se postavi v mapo dist.