build() — tailwindcss Function Reference

Architecture documentation for the build() function in index.ts from the tailwindcss codebase.

Function typescript OxideCore PreProcessors calls 2 called by 1

Entity Profile

OxideCore→ PreProcessors→ build() — tailwindcss Function Reference

Dependency Diagram

graph TD
  7665e7ed_1eb9_439b_dcf3_ba3075d2cb78["build()"]
  79efb43f_fcca_c5cf_0bb0_c18f1a2fffc0["rebuild()"]
  79efb43f_fcca_c5cf_0bb0_c18f1a2fffc0 -->|calls| 7665e7ed_1eb9_439b_dcf3_ba3075d2cb78
  53ebf260_055a_065a_97c6_10bc1d92476b["start()"]
  7665e7ed_1eb9_439b_dcf3_ba3075d2cb78 -->|calls| 53ebf260_055a_065a_97c6_10bc1d92476b
  020a5eed_39cf_05ec_e603_096fba2472da["end()"]
  7665e7ed_1eb9_439b_dcf3_ba3075d2cb78 -->|calls| 020a5eed_39cf_05ec_e603_096fba2472da
  style 7665e7ed_1eb9_439b_dcf3_ba3075d2cb78 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/@tailwindcss-browser/src/index.ts lines 177–206

async function build(kind: 'full' | 'incremental') {
  if (!compiler) return

  // 1. Refresh the known list of classes
  let newClasses = new Set<string>()

  I.start(`Collect classes`)

  for (let element of document.querySelectorAll('[class]')) {
    for (let c of element.classList) {
      if (classes.has(c)) continue

      classes.add(c)
      newClasses.add(c)
    }
  }

  I.end(`Collect classes`, {
    count: newClasses.size,
  })

  if (newClasses.size === 0 && kind === 'incremental') return

  // 2. Compile the CSS
  I.start(`Build utilities`)

  sheet.textContent = compiler.build(Array.from(newClasses))

  I.end(`Build utilities`)
}