Formatiranje JavaScript koda na mreži
Zalijepite minificiranu .js datoteku, webpack paket ili isječak u jednom retku i u desnom oknu dobit ćete pravilno uvučen JavaScript. Prettier obavlja formatiranje u vašem pregledniku, bez slanja sadržaja bilo kamo.
Zašto JavaScript postane nečitljiv
Mnogi postupci izgradnje za produkciju minificiraju JavaScript prije isporuke. Alati uklanjaju nepotrebne razmake i komentare, a mogu skratiti nazive ili preoblikovati izraze. Zaseban korak pakiranja može spojiti module u veće datoteke, pa se isporučena skripta može znatno razlikovati od izvora projekta. Cilj je očuvati ponašanje i pripremiti kod za isporuku, ali ručni pregled postaje teži. Projekt s mnogo čitljivih modula može stići kao nekoliko zbijenih paketa. Formatiranje otkriva strukturu preostalu u tim paketima, bez poništavanja promjena nastalih izgradnjom.
Što vam formatiranje doista vraća
Formatiranje paketa dodaje prijelome redaka, razmake i uvlake koji olakšavaju pregled preostalog programa. Ugniježđene funkcije i uvjetne grane postaju vidljive, a nizove znakova ili nazive krajnjih točaka lakše je pronaći. Novi brojevi redaka pripadaju formatiranoj kopiji: trag stoga minificirane datoteke i dalje se odnosi na tu izvornu datoteku. LFUnminify ne prevodi te položaje niti ih povezuje s izvornim mapama. Formatirani prikaz koristite za razumijevanje okolne logike, a program za otklanjanje pogrešaka u pregledniku za istraživanje točnih mjesta pri izvršavanju. Dobro polazište je prepoznatljiv niz znakova iz poruke o pogrešci ili mrežnog zahtjeva. Pronađite ga u formatiranoj kopiji i pročitajte okolne uvjete, bez pretpostavke da je najbliža funkcija uzrok problema. Generirane pomoćne funkcije i omotači za izvršavanje ostaju u paketu nakon formatiranja. Usporedba tog konteksta s izvornim kodom, kada je dostupan, daje pouzdanije objašnjenje od samih uvlaka.
Podržana je suvremena sintaksa
Alat obrađuje suvremeni JavaScript, a ne ograničeni skup mogućnosti od prije deset godina. Podržane su streličaste funkcije, klase, async i await, generatori, neobavezno ulančavanje, operator za zadanu vrijednost pri null ili undefined, predlošci nizova znakova, destrukturiranje, sintaksa proširivanja, dinamički uvozi i ES moduli. Podržan je i JSX, što je važno pri pregledu React komponente koja je prevedena bez pretvaranja te sintakse. Budući da posao obavlja Prettier, izlaz slijedi dosljedna pravila, iako se postavke ovog alata mogu razlikovati od postavki vašeg uređivača.
Gdje su ograničenja
Formatiranje ne poništava promjene nastale izgradnjom. Varijabla nazvana n ostaje n, čak i ako se izvorno zvala remainingRetries. Spojeni moduli ostaju u dostavljenom paketu, a izbrisani komentari ne mogu se pouzdano zaključiti. Izvorni repozitorij ili izvorna mapa mogu pomoći u vraćanju konteksta izvan ovog alata. Namjerno zamagljen kod ostaje zamagljen: kodirani nizovi znakova, umjetne grane i zavaravajući nazivi i dalje mogu prikrivati značenje. Rezultat koristite kao pomoć pri pregledu, a zatim sve izmjene testirajte u stvarnom projektu.
Često postavljana pitanja
Može li alat formatirati webpack ili Vite paket?
Da, podržane JavaScript pakete možete formatirati nakon lijepljenja sadržaja ili otvaranja lokalne datoteke. Izlaz zadržava objedinjeni kod i ne obnavlja zasebne izvorne module. Veliki paketi mogu usporiti preglednik ili ga učiniti neodazivnim, pa kada je moguće pregledajte manji, potpuni odjeljak.
Uklanja li obfuskaciju JavaScripta?
Može formatirati podržanu JavaScript sintaksu u zamagljenoj datoteci, ali ne poništava obfuskaciju. Kodirani nizovi znakova, umjetno oblikovan tijek izvođenja i namjerno zavaravajući nazivi ostaju. Uvlake mogu pomoći u istraživanju tih struktura, ali sam čitljiv raspored ne dokazuje što skripta radi ni je li pouzdana.
Može li pokvariti moj kod?
Cilj alata je očuvati ponašanje JavaScripta uz dosljedan stil. Može promijeniti interpunkciju, navodnike i raspored, pa rezultat nije kopija istovjetna po bajtovima. Sačuvajte izvornik, pregledajte izlaz i pokrenite testove projekta prije uporabe uređenog ili formatiranog paketa u produkciji.