JavaScript-formaterare och minifierare

Så formaterar eller minifierar du JavaScript

1. Klistra in din kod, eller klicka på Öppna en fil för att läsa in en .js-, .mjs- eller .jsx-fil (upp till 10 MB).
2. Välj Indrag och kryssa i Klamrar på egen rad om du föredrar Allman-stilen.
3. Klicka på Formatera (beautify) för att göra koden läsbar.
4. För att krympa den ställer du in Alternativ för minifiering och klickar på Minifiera. Vill du bara leta efter fel klickar du på Kontrollera syntax.
5. Kopiera eller ladda ner resultatet. Statusraden visar storleken före och efter, och hur många procent du sparat.

Koden läses och omvandlas bara, den körs aldrig: inget du klistrar in exekveras på den här sidan.

Formatera med js-beautify

Formatera (beautify) använder js-beautify. Det lägger en sats per rad, gör indrag för block, lägger till mellanslag runt operatorer och efter nyckelord, och behåller upp till en tom rad där du hade sådana. Det förstår också modern syntax (klasser, pilfunktioner, mallsträngar, async/await) och JSX. Det är det snabbaste sättet att läsa ett minifierat bibliotek eller ett kodavsnitt på en rad som kopierats från en webbsida.

Formateringen ändrar bara blanksteg. Den kontrollerar inte att koden är giltig: en saknad parentes ger bara konstiga indrag. Använd Kontrollera syntax för det.

Minifiera med Terser

Minifiera använder Terser, minifieraren som de flesta byggverktyg för JavaScript använder. Eftersom den är stor laddas den ner först när du klickar på Minifiera eller Kontrollera syntax första gången. Alternativen motsvarar direkt inställningar i Terser:

• ES-modul (import/export) tolkar koden som en modul (module: true): strict mode gäller och namn på toppnivå är privata, så de kan döpas om och oanvända namn tas bort. Lämna det avmarkerat för ett klassiskt skript vars globala funktioner används av andra skript.
• Komprimera (compress) skriver om koden till kortare, likvärdig kod: konstantvikning (2*60 blir 120), borttagning av död kod, sammanslagning av var-deklarationer och kortare villkor.
• Korta variabelnamn (mangle) döper om lokala variabler och parametrar till en eller två bokstäver. Globala namn och objektegenskaper döps aldrig om.
• Behåll licenskommentarer behåller kommentarer som börjar med /*! eller innehåller @license eller @preserve. Alla andra kommentarer tas bort.

Minifieringen kan inte ändra vad koden gör, men kod som är beroende av funktionsnamn (fn.name) eller av eval kan bete sig annorlunda efter omdöpningen. Avmarkera Korta variabelnamn i så fall.

Syntaxfel med rad och kolumn

När Terser inte kan tolka koden visar Minifiera och Kontrollera syntax felmeddelandet med rad och kolumn, till exempel ”Rad 12, kolumn 8 – Syntaxfel: Unexpected token punc «)»”. Själva felbeskrivningen kommer från Terser och är på engelska. Kolumnen räknar tecken från 1. En vanlig orsak är en saknad klammer tidigare i filen, så titta även på raderna strax före den angivna positionen.