Runtime
UnoCSS runtime biedt een CDN build die de UnoCSS direct in de browser draait. Het zal de DOM veranderingen detecteren en de stijlen on-the-fly genereren.
Gebruik
Voeg de volgende regel toe aan je index.html:
html
<script src="https://cdn.jsdelivr.net/npm/@unocss/runtime"></script>De runtime kan worden geconfigureerd door de configuratie te definiëren voordat de runtime wordt geladen:
html
<!-- define unocss options... -->
<script>
window.__unocss = {
rules: [
// custom rules...
],
presets: [
// custom presets...
],
// ...
}
</script>
<!-- ... and then load the runtime -->
<script src="https://cdn.jsdelivr.net/npm/@unocss/runtime"></script>Standaard wordt de Wind3 preset toegepast.
De runtime wordt niet geleverd met preflights, als je stijl resets wilt, kun je je eigen toevoegen, of er een gebruiken van het Reset pakket.
html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@unocss/reset/normalize.min.css" />
<!-- or -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@unocss/reset/tailwind.min.css" />Builds
Verschillende builds zijn beschikbaar voor verschillende use cases.
Uno (standaard)
Met @unocss/preset-wind3 preset:
html
<script src="https://cdn.jsdelivr.net/npm/@unocss/runtime/uno.global.js"></script>