@unocss/transformer-compile-class

Compile group of classes into one class. Inspired by WindiCSS's compilation mode and #948 by @UltraCakeBakery.

Install

npm i -D @unocss/transformer-compile-class

import transformerCompileClass from '@unocss/transformer-compile-class'
// uno.config.ts
import { defineConfig } from 'unocss'

export default defineConfig({
  // ...
  transformers: [
    transformerCompileClass(),
  ],
})

Usage

At the begin of your class strings, add :uno: at the begin of the strings to mark them for compilation. For example:

<div class=":uno: text-center sm:text-left">
  <div class=":uno: text-sm font-bold hover:text-red" />
</div>

Will be compiled to:

<div class="uno-qlmcrp">
  <div class="uno-0qw2gr" />
</div>

.uno-qlmcrp {
  text-align: center;
}
.uno-0qw2gr {
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 700;
}
.uno-0qw2gr:hover {
  --un-text-opacity: 1;
  color: rgb(248 113 113 / var(--un-text-opacity));
}
@media (min-width: 640px) {
  .uno-qlmcrp {
    text-align: left;
  }
}

Options

You can config the trigger string and prefix for compile class with the options. Refers to the types for details.

License

Current Tags

66.6.3 ... latest (a month ago)

256 Versions

66.6.3 ... a month ago
66.6.2 ... 2 months ago
66.6.1 ... 2 months ago
66.6.0 ... 3 months ago
66.6.0-beta.1 ... 3 months ago
66.5.12 ... 3 months ago
66.5.11 ... 4 months ago
66.5.10 ... 4 months ago
66.5.10-beta.1 ... 4 months ago
66.5.9 ... 5 months ago
66.5.7 ... 5 months ago
66.5.6 ... 5 months ago
66.5.5 ... 5 months ago
66.5.4 ... 6 months ago
66.5.3 ... 6 months ago
66.5.2 ... 7 months ago
66.5.1 ... 7 months ago
66.5.0 ... 7 months ago
66.4.2 ... 8 months ago
66.4.1 ... 8 months ago
66.4.0 ... 8 months ago
66.3.3 ... 9 months ago
66.3.2 ... 10 months ago
66.3.1 ... 10 months ago
66.3.1-beta.1 ... 10 months ago
66.2.3 ... 10 months ago
66.2.2 ... 10 months ago
66.2.1 ... 10 months ago
66.2.0 ... 10 months ago
66.1.4 ... 10 months ago
66.1.3 ... 10 months ago
66.1.2 ... a year ago
66.1.1 ... a year ago
66.1.0 ... a year ago
66.1.0-beta.13 ... a year ago
66.1.0-beta.12 ... a year ago
66.1.0-beta.11 ... a year ago
66.1.0-beta.10 ... a year ago
66.1.0-beta.9 ... a year ago
66.1.0-beta.8 ... a year ago
66.1.0-beta.7 ... a year ago
66.1.0-beta.6 ... a year ago
66.1.0-beta.5 ... a year ago
66.1.0-beta.4 ... a year ago
66.1.0-beta.3 ... a year ago
66.1.0-beta.2 ... a year ago
66.1.0-beta.1 ... a year ago
66.0.0 ... a year ago
65.5.0 ... a year ago
65.4.3 ... a year ago
65.4.2 ... a year ago
65.4.0 ... a year ago
0.65.4 ... a year ago
0.65.3 ... a year ago
0.65.2 ... a year ago
0.65.1 ... a year ago
0.65.0 ... a year ago
0.65.0-beta.3 ... a year ago
0.65.0-beta.2 ... a year ago
0.65.0-beta.1 ... a year ago
0.64.1 ... a year ago
0.64.0 ... a year ago
0.63.6 ... a year ago
0.63.5 ... a year ago
0.63.4 ... 2 years ago
0.63.3 ... 2 years ago
0.63.2 ... 2 years ago
0.63.1 ... 2 years ago
0.63.0 ... 2 years ago
0.62.4 ... 2 years ago
0.62.3 ... 2 years ago
0.62.2 ... 2 years ago
0.62.1 ... 2 years ago
0.62.0 ... 2 years ago
0.61.9 ... 2 years ago
0.61.8 ... 2 years ago
0.61.7 ... 2 years ago
0.61.6 ... 2 years ago
0.61.5 ... 2 years ago
0.61.4 ... 2 years ago
0.61.3 ... 2 years ago
0.61.2 ... 2 years ago
0.61.0 ... 2 years ago
0.60.4 ... 2 years ago
0.60.3 ... 2 years ago
0.60.2 ... 2 years ago
0.60.1 ... 2 years ago
0.60.0 ... 2 years ago
0.59.4 ... 2 years ago
0.59.3 ... 2 years ago
0.59.2 ... 2 years ago
0.59.1 ... 2 years ago
0.59.0 ... 2 years ago
0.59.0-beta.1 ... 2 years ago
0.58.9 ... 2 years ago
0.58.8 ... 2 years ago
0.58.7 ... 2 years ago
0.58.6 ... 2 years ago
0.58.5 ... 2 years ago
0.58.4 ... 2 years ago
0.58.3 ... 2 years ago
0.58.2 ... 2 years ago
0.58.1 ... 2 years ago
0.58.0 ... 2 years ago
0.57.7 ... 2 years ago
0.57.6 ... 2 years ago
0.57.5 ... 2 years ago
0.57.4 ... 2 years ago
0.57.3 ... 2 years ago
0.57.2 ... 2 years ago
0.57.1 ... 2 years ago
0.57.0 ... 2 years ago
0.56.5 ... 3 years ago
0.56.4 ... 3 years ago
0.56.3 ... 3 years ago
0.56.2 ... 3 years ago
0.56.1 ... 3 years ago
0.56.0 ... 3 years ago
0.55.7 ... 3 years ago
0.55.6 ... 3 years ago
0.55.5 ... 3 years ago
0.55.4 ... 3 years ago
0.55.3 ... 3 years ago
0.55.2 ... 3 years ago
0.55.1 ... 3 years ago
0.55.0 ... 3 years ago
0.54.3 ... 3 years ago
0.54.2 ... 3 years ago
0.54.1 ... 3 years ago
0.54.0 ... 3 years ago
0.53.6 ... 3 years ago
0.53.5 ... 3 years ago
0.53.4 ... 3 years ago
0.53.3 ... 3 years ago
0.53.1 ... 3 years ago
0.53.0 ... 3 years ago
0.52.7 ... 3 years ago
0.52.6 ... 3 years ago
0.52.5 ... 3 years ago
0.52.4 ... 3 years ago
0.52.3 ... 3 years ago
0.52.2 ... 3 years ago
0.52.1 ... 3 years ago
0.52.0 ... 3 years ago
0.51.13 ... 3 years ago
0.51.12 ... 3 years ago
0.51.11 ... 3 years ago
0.51.8 ... 3 years ago
0.51.7 ... 3 years ago
0.51.6 ... 3 years ago
0.51.5 ... 3 years ago
0.51.4 ... 3 years ago
0.51.3 ... 3 years ago
0.51.2 ... 3 years ago
0.51.1 ... 3 years ago
0.51.0 ... 3 years ago
0.50.8 ... 3 years ago
0.50.7 ... 3 years ago
0.50.6 ... 3 years ago
0.50.5 ... 3 years ago
0.50.4 ... 3 years ago
0.50.3 ... 3 years ago
0.50.2 ... 3 years ago
0.50.1 ... 3 years ago
0.50.0 ... 3 years ago
0.49.8 ... 3 years ago
0.49.7 ... 3 years ago
0.49.6 ... 3 years ago
0.49.5 ... 3 years ago
0.49.4 ... 3 years ago
0.49.3 ... 3 years ago
0.49.2 ... 3 years ago
0.49.1 ... 3 years ago
0.49.0 ... 3 years ago
0.48.5 ... 3 years ago
0.48.4 ... 3 years ago
0.48.3 ... 3 years ago
0.48.2 ... 3 years ago
0.48.1 ... 3 years ago
0.48.0 ... 3 years ago
0.47.6 ... 3 years ago
0.47.5 ... 3 years ago
0.47.4 ... 3 years ago
0.47.3 ... 3 years ago
0.47.2 ... 3 years ago
0.47.1 ... 3 years ago
0.47.0 ... 3 years ago
0.46.5 ... 3 years ago
0.46.4 ... 3 years ago
0.46.3 ... 3 years ago
0.46.2 ... 3 years ago
0.46.1 ... 3 years ago
0.46.0 ... 3 years ago
0.45.30 ... 3 years ago
0.45.29 ... 4 years ago
0.45.28 ... 4 years ago
0.45.26 ... 4 years ago
0.45.25 ... 4 years ago
0.45.24 ... 4 years ago
0.45.23 ... 4 years ago
0.45.22 ... 4 years ago
0.45.21 ... 4 years ago
0.45.20 ... 4 years ago
0.45.19 ... 4 years ago
0.45.18 ... 4 years ago
0.45.15 ... 4 years ago
0.45.14 ... 4 years ago
0.45.13 ... 4 years ago
0.45.12 ... 4 years ago
0.45.9 ... 4 years ago
0.45.8 ... 4 years ago
0.45.7 ... 4 years ago
0.45.6 ... 4 years ago
0.45.5 ... 4 years ago
0.45.4 ... 4 years ago
0.45.3 ... 4 years ago
0.45.1 ... 4 years ago
0.44.7 ... 4 years ago
0.44.5 ... 4 years ago
0.44.4 ... 4 years ago
0.44.3 ... 4 years ago
0.44.2 ... 4 years ago
0.44.1 ... 4 years ago
0.44.0 ... 4 years ago
0.43.2 ... 4 years ago
0.43.1 ... 4 years ago
0.43.0 ... 4 years ago
0.42.1 ... 4 years ago
0.42.0 ... 4 years ago
0.41.2 ... 4 years ago
0.41.1 ... 4 years ago
0.41.0 ... 4 years ago
0.40.0 ... 4 years ago
0.39.3 ... 4 years ago
0.39.2 ... 4 years ago
0.39.1 ... 4 years ago
0.39.0 ... 4 years ago
0.38.2 ... 4 years ago
0.38.1 ... 4 years ago
0.38.0 ... 4 years ago
0.37.4 ... 4 years ago
0.37.3 ... 4 years ago
0.37.2 ... 4 years ago
0.37.1 ... 4 years ago
0.37.0 ... 4 years ago
0.36.0 ... 4 years ago
0.35.4 ... 4 years ago
0.35.3 ... 4 years ago
0.35.2 ... 4 years ago
0.35.1 ... 4 years ago
0.35.0 ... 4 years ago
0.34.1 ... 4 years ago
0.34.0 ... 4 years ago
0.33.5 ... 4 years ago
0.33.4 ... 4 years ago
0.33.2 ... 4 years ago