Code-formatter & minifier
Maak HTML, CSS en JavaScript direct in je browser mooier of minificeer ze, met inspringing van 2 spaties, 4 spaties of een tab en JavaScript-compressie op basis van Terser.
Code-formatter & minifier — Plak HTML, CSS of JavaScript, kies Opmaken om het overzichtelijk te formatteren met inspringing van 2 spaties, 4 spaties of een tab, of kies Minificeren om het te verkleinen voor productie. JavaScript wordt geminificeerd met Terser, terwijl CSS en HTML worden gecomprimeerd door commentaar en overtollige witruimte veilig te verwijderen. Alles draait volledig in je browser, dus je code wordt nooit geüpload.
Wat is Code-formatter & minifier?
Een gratis online code-formatter en -minifier die HTML, CSS en JavaScript opmaakt of minificeert zonder ooit je browser te verlaten. Kies de taal en selecteer vervolgens Opmaken om rommelige of eenregelige broncode opnieuw in te springen met 2 spaties, 4 spaties of een tab, of Minificeren om het te comprimeren. Het opmaken wordt aangedreven door js-beautify; de JavaScript-minificatie gebruikt Terser om namen in te korten en de grootte te verkleinen, terwijl CSS en HTML worden gecomprimeerd door commentaar te verwijderen en overbodige witruimte samen te voegen. Webontwikkelaars gebruiken het om geminificeerde code van derden leesbaar op te schonen, stylesheets en scripts te verkleinen vóór het deployen, en fragmenten op te ruimen die uit de build-uitvoer zijn geplakt.
Code-formatter & minifier gebruiken
- Kies de taal van je broncode: HTML, CSS of JS.
- Kies de actie: Opmaken om te formatteren, of Minificeren om te comprimeren.
- Kies bij Opmaken de inspringing: 2 spaties, 4 spaties of Tab.
- Plak of typ je code in het invoerveld – de uitvoer wordt automatisch bijgewerkt.
- Gebruik de knop Kopiëren om het resultaat te pakken, of klik op Wissen om de invoer te legen en opnieuw te beginnen.
Voorbeelden
Een CSS-regel van één regel opmaken (2 spaties)
Invoer
a{color:red;font-weight:bold}Uitvoer
a {
color: red;
font-weight: bold
}JavaScript minificeren met Terser
Invoer
function add(first, second) {
return first + second;
}Uitvoer
function add(n,d){return n+d}HTML minificeren
Invoer
<ul> <li>One</li> <li>Two</li> </ul>
Uitvoer
<ul><li>One</li><li>Two</li></ul>
Veelgestelde vragen
- Wordt mijn code naar een server geüpload?
- Nee. Het opmaken en minificeren gebeurt allemaal lokaal in je browser – js-beautify en Terser worden als scripts geladen en op je apparaat uitgevoerd. Je code verlaat je machine nooit, en de tool blijft offline werken.
- Welke talen en acties worden ondersteund?
- Drie talen - HTML, CSS en JavaScript - elk met twee acties: Opmaken (formatteren met de gekozen inspringing) en Minificeren (comprimeren). JavaScript wordt geminificeerd met Terser, terwijl CSS en HTML worden gecomprimeerd door commentaar te verwijderen en witruimte samen te voegen.
- Welke inspringing kan ik kiezen?
- Bij het opmaken kun je opnieuw inspringen met 2 spaties, 4 spaties of een tab-teken. De inspringing geldt alleen voor Opmaken; Minificeren verwijdert witruimte en negeert deze instelling.
- Waarom gaf het minificeren van mijn JavaScript een foutmelding?
- Terser parseert je JavaScript voordat het wordt geminificeerd, dus een syntaxfout stopt het en de melding wordt boven de uitvoer getoond. Herstel de aangegeven plek - vaak een niet-gesloten haakje of string, of een verdwaald token - en het resultaat wordt automatisch opnieuw opgebouwd.
- Wordt de uitvoer vanzelf bijgewerkt?
- Ja. Het resultaat wordt opnieuw opgebouwd telkens wanneer je de invoer, taal, actie of inspringing wijzigt, dus je hoeft nooit op een knop te drukken om te formatteren: kopieer gewoon de uitvoer wanneer die er goed uitziet.
Gerelateerde tools
Base32 / Base58 coderen / decoderen
Codeer tekst naar Base32 (RFC 4648) of Base58 (het Bitcoin-alfabet) en decodeer beide weer terug naar tekst, volledig UTF-8-veilig en geheel in je browser.
Base64 coderen / decoderen
Codeer tekst naar Base64 of decodeer Base64 terug naar tekst (UTF-8-veilig).
Hoofdletterconverter & teller
Wijzig de hoofdlettervorm van tekst en tel tekens, woorden en regels.
Kleurconverter
Converteer kleuren tussen HEX, RGB en HSL met een live voorbeeld.