extractUsedVariables() — tailwindcss Function Reference

Architecture documentation for the extractUsedVariables() function in variables.ts from the tailwindcss codebase.

Function typescript CompilerEngine ModuleResolution calls 2 called by 2

Entity Profile

CompilerEngine→ ModuleResolution→ extractUsedVariables() — tailwindcss Function Reference

Dependency Diagram

graph TD
  e9e50ff6_7df6_110f_a568_3816eef96d3a["extractUsedVariables()"]
  ec867cf3_916b_0d16_65ec_c715e69fee03["optimizeAst()"]
  ec867cf3_916b_0d16_65ec_c715e69fee03 -->|calls| e9e50ff6_7df6_110f_a568_3816eef96d3a
  cebe77e1_f0f2_aeee_417e_2192f5790344["buildDesignSystem()"]
  cebe77e1_f0f2_aeee_417e_2192f5790344 -->|calls| e9e50ff6_7df6_110f_a568_3816eef96d3a
  e9d556bc_f22d_356c_1bd2_27442c34b5c7["walk()"]
  e9e50ff6_7df6_110f_a568_3816eef96d3a -->|calls| e9d556bc_f22d_356c_1bd2_27442c34b5c7
  0638028e_f2f7_8e77_2f19_1bd2ce4b2d6a["parse()"]
  e9e50ff6_7df6_110f_a568_3816eef96d3a -->|calls| 0638028e_f2f7_8e77_2f19_1bd2ce4b2d6a
  style e9e50ff6_7df6_110f_a568_3816eef96d3a fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/tailwindcss/src/utils/variables.ts lines 4–18

export function extractUsedVariables(raw: string): string[] {
  let variables: string[] = []
  walk(ValueParser.parse(raw), (node) => {
    if (node.kind !== 'function' || node.value !== 'var') return

    walk(node.nodes, (child) => {
      if (child.kind !== 'word' || child.value[0] !== '-' || child.value[1] !== '-') return

      variables.push(child.value)
    })

    return WalkAction.Skip
  })
  return variables
}