Ukoliko postoji neka “typing” greška u codu koja se ne može parsirati u ispravan javascript code, onda webpack u consoli vrisne grešku kod parsiranja. No ako ja imam uključenu watch opciju, vrlo vjerovatno tu grešku neću vidjeti nego ću refreshati browser i proučavati web misleći da je to zadnja istipkana verzija. Tek nakon što posumnjam u to, provjerim consolu i shvaćam da sam imao grešku…te da sam u browseru gledao zadnju uspješnu kompajliranu verziju. To zna biti malo naporno kada te tako zezne splet okolnosti da buljiš u browser zavaravajući se koju verziju gledaš.
Može li se ikako napraviti da kod greške kompilacije se ispis te greške prenese do browsera, tako da se tamo odmah može uočiti da je došlo do greške?
webpack kod kompilacije slaže bundle.js …kako se može podesiti da taj bundle u svakom nastanku dobije version tag tipa “bundle.js?v=1248584” , kako bi browser bio forsiran da učitava uvijek svježu bundle verziju?
Sto se tice prve stvari ukoliko koristis webpack-dev-server odnosno hot module reloading mozes definisati overlay - check this
I na svaki save file-a ukoliko postoji error dobit ces overlay preko app-a koji ukazuje gdje je error, odnosno prakticno ispisat ce ti ono sto pise u terminalu.
Kako s webpackom napraviti import develop funkcija koje bi koristili smao u dev modu?
Neka svaka moja skripta koristi recimo jednu funkciju "myDevFunkc()", koju koristim samo u razvojnoj okolini. Prema ovome što trenutno znam, trebao bi u svakoj komponenti (skripti) pozivati : import {myDevFunkc} from 'myDevScripts'
…problem nastaje što onda ne mogu jednostavno switchati iz dev u production mode. Morao bi ići u svaku komponentu i obrisati/zakomentirati taj import statement …što ne zvuči baš kao ispravan način.
“Replacing process.env.NODE_ENV with string literals also allows minifiers like UglifyJS to completely drop the development-only code blocks, reducing final file size.”
…nisam siguran o čemu se baš radi, pa ako me netko može uputiti gdje saznati više o tom.
Čini mi se super ako postoji način da se parcijalno tagiraju djelovi codea koji bi bili dropani prilikom minimiziranja. To mi možda odgovara i na prvo pitanje …mada mislim da bi trebao biti drugačiji pristup kada se veći komadi funkcionalnosti žele uključiti/isključiti ovisno od verzije dev/prod.
Ovo gore pitanje slobodno zanemarite, krenuo sam detaljno češljati dokumentaciju i vidim da će biti materijala za naučiti … a vjerovatno ni nema kratkog odgovora xd.
Nego, zapeo sam na nekoj sitnici. Krenuo sam s novim fresh webpack projectom da sve testiram uzduž i popreko i započetak sam htio instalirati globalno stvari koje se koriste na svim projektima. Jer mi nema smisla da projekti lokalno budu teški skoro do gigu zbog developmenta. (A tako je zadnji završio, ujedno moje prvo korištenje webpacka)
…i sada sam ja instalirao globalno css loadere npm install --global style-loader css-loader
…no stvar ne želi šljakati tako. Vrisne mi grešku:
Module not found: Error: Can’t resolve ‘style-loader’ in ‘C:\Users\bozidar.DESKTOP-F6J3TPV\source\repos\testWebpack’
A zbog cega instaliras loader-e globalno, kad su oni striktno vezani za sami projekat ? Instaliraj ih lokalno, striktno za taj project dir i raditi ce bez problema.
Pa lokalno radi, ali ne kuzim kako su striktno vezani za projekt…pa cak bi se i cijeli webpack trebao moci instalirati globalno. Uloga webpacka i loadera je ista, nevezano o kojem projektu se radi. Ako nesto parsira css, zasto bi njega bilo briga jel taj css od ovog ili onog projekta.
A zelim instalirati sve te pluginove globalno, jer ne vidim smisla da su ugnjezeni u strukturu projekta…i da se bespotrebno multipliciraju za svaki projekt. Kao sto rekoh…zadnji projekt mi je skoro pojeo gigu prostora, valjda tek 1% su mi source fileovi.
To je ok sve dok ti iskljucivo sam radis na projektu, ili dok taj isti projekat ne dodje do faze deploya (u zavisnosti kako se on radi)
Kada neko drugi klonira tvoj isti repo, koji u package.json file nema zabiljezen taj loader ili pak vise njih, dobit ce hrpu errora, zatim ce morati proci kroz webpack file da vidi sta se koristi, i instalirati potrebno.
Ako nekim slucajem imas neki CI, koji automatski vuce promijene sa Git-a i builda staging server, opet ces dobiti errore, jer u package.json nema navedenih loader-a.
Mozes li mi jos samo potvrditi:
Ako ne instaliras loadere globalno, vec lokalno uz sami projekat - sve radi normalno ?
Pa ovo gore si upravu, a opet ako bi vise ljudi radilo na projektu a zna se koja tehnologija se koristi…onda bi valjda i svi imali sve potrebno globalno instalirano…a ne da se sve multilicira po projektu. Ali nemam iskustva sto se tog tice… i vrlo vjerovatno je logicnije sto ti govoris. Svejedno…to mi je trenutno i sporedno…isto kao sto mi je sporedno hocu li multiplicirati tih par MBa od loadera…vise sam znatizeljan zasto ne radi globalno i u čemu je kvaka. Pa nešto da naučim
Ovo zadnje je potvrdno, sve radi ako ih instaliram lokalno --save-dev.
Nisam jedino probao s webpack instalacijom globalno, mozda u tom slucaju oboje trebaju ici globalno, hmn…
