substituteAtImports() — tailwindcss Function Reference

Architecture documentation for the substituteAtImports() function in at-import.ts from the tailwindcss codebase.

Function typescript Oxide PreProcessors calls 5 called by 1

Entity Profile

Oxide→ PreProcessors→ substituteAtImports() — tailwindcss Function Reference

Dependency Diagram

graph TD
  2d1ddb63_f29d_b245_22dc_8060d98def4c["substituteAtImports()"]
  061a1d94_150d_9879_9075_9c457da6010d["at-import.ts"]
  2d1ddb63_f29d_b245_22dc_8060d98def4c -->|defined in| 061a1d94_150d_9879_9075_9c457da6010d
  f7f9b3da_5977_1aa6_3bcb_bfc607af4e8f["parseCss()"]
  f7f9b3da_5977_1aa6_3bcb_bfc607af4e8f -->|calls| 2d1ddb63_f29d_b245_22dc_8060d98def4c
  4982d9ce_98d4_85d9_44af_7cc47b93c482["walk()"]
  2d1ddb63_f29d_b245_22dc_8060d98def4c -->|calls| 4982d9ce_98d4_85d9_44af_7cc47b93c482
  6037d149_2cd7_be02_40f7_bc552380ed53["parseImportParams()"]
  2d1ddb63_f29d_b245_22dc_8060d98def4c -->|calls| 6037d149_2cd7_be02_40f7_bc552380ed53
  b75d79c9_e7f1_5470_9b5b_82bcda89d98f["context()"]
  2d1ddb63_f29d_b245_22dc_8060d98def4c -->|calls| b75d79c9_e7f1_5470_9b5b_82bcda89d98f
  6e8e64bc_b624_8f35_529a_8c3679d9e996["buildImportNodes()"]
  2d1ddb63_f29d_b245_22dc_8060d98def4c -->|calls| 6e8e64bc_b624_8f35_529a_8c3679d9e996
  9d7d664d_b6fd_88fd_8800_4b530c33a95b["parse()"]
  2d1ddb63_f29d_b245_22dc_8060d98def4c -->|calls| 9d7d664d_b6fd_88fd_8800_4b530c33a95b
  style 2d1ddb63_f29d_b245_22dc_8060d98def4c fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/tailwindcss/src/at-import.ts lines 16–81

export async function substituteAtImports(
  ast: AstNode[],
  base: string,
  loadStylesheet: LoadStylesheet,
  recurseCount = 0,
  track = false,
) {
  let features = Features.None
  let promises: Promise<void>[] = []

  walk(ast, (node) => {
    if (node.kind === 'at-rule' && (node.name === '@import' || node.name === '@reference')) {
      let parsed = parseImportParams(ValueParser.parse(node.params))
      if (parsed === null) return
      if (node.name === '@reference') {
        parsed.media = 'reference'
      }

      features |= Features.AtImport

      let { uri, layer, media, supports } = parsed

      // Skip importing data or remote URIs
      if (uri.startsWith('data:')) return
      if (uri.startsWith('http://') || uri.startsWith('https://')) return

      let contextNode = context({}, [])

      promises.push(
        (async () => {
          // Since we do not have fully resolved paths in core, we can't
          // reliably detect circular imports. Instead, we try to limit the
          // recursion depth to a number that is too large to be reached in
          // practice.
          if (recurseCount > 100) {
            throw new Error(
              `Exceeded maximum recursion depth while resolving \`${uri}\` in \`${base}\`)`,
            )
          }

          let loaded = await loadStylesheet(uri, base)
          let ast = CSS.parse(loaded.content, { from: track ? loaded.path : undefined })
          await substituteAtImports(ast, loaded.base, loadStylesheet, recurseCount + 1, track)

          contextNode.nodes = buildImportNodes(
            node,
            [context({ base: loaded.base }, ast)],
            layer,
            media,
            supports,
          )
        })(),
      )

      // The resolved Stylesheets already have their transitive @imports
      // resolved, so we can skip walking them.
      return WalkAction.ReplaceSkip(contextNode)
    }
  })

  if (promises.length > 0) {
    await Promise.all(promises)
  }

  return features
}