compileThemeToCss
Compile a `TokenTheme` into the token CSS a template's bundle ships.
Compile a TokenTheme into the token CSS a template’s bundle ships. The font-loading
block is NOT here — it is {@link compileFontFacesToCss}, which a caller prepends to
the finished bundle rather than feeding through the Tailwind graph.
@theme inline { --color-<name>: var(--tr-color-<name>); … }— the Tailwind alias layer, which is what brings the token utilities into existence;@theme { --breakpoint-<name>: <value>; … }— this template’s own breakpoints, emitted only when it declares any. Their values are written straight into the block rather than aliased through--tr-*, because a media query needs a literal length;:root { --tr-color-<name>: <value>; … }— the values behind those aliases;body { … }— the document defaults, asvar()indirections so that a runtime:rootoverride still cascades to the page.
The output MUST be compiled INSIDE the Tailwind build graph: @theme is a Tailwind
directive, and anywhere else it is inert — silently, yielding a stylesheet with no
token utilities and no error to explain why.
Deterministic: keys are sorted, so the same theme always content-hashes identically.
Import from @homepages/template-kit.
Signature
Section titled “Signature”function compileThemeToCss(theme: TokenTheme): stringParameters
Section titled “Parameters”| Name | Type | Required | Description |
|---|---|---|---|
theme |
TokenTheme |
required |
Returns
Section titled “Returns”string